美文网首页
React-native 小计第一天(筛选栏的实现)

React-native 小计第一天(筛选栏的实现)

作者: 饭后的甜点_ | 来源:发表于2017-07-21 00:59 被阅读650次

    第一天我们大概要实现的效果是这样的直接上图.因为最近做的项目是类似于电商的,所以要实现筛选功能,大体和某宝的筛选销量和尺寸相同的功能.  (哈哈哈.  我就想笑)..

    筛选图片1

    做什么功能我们都要简单分析一下,才能知道如何下手 . 

    .思路

    1. 首先 我们需要做上方选项栏 有综合排序 , 地区选择 等等 3个选项卡按钮

    2.底部滑动视图 , 点击不同选项卡 切换数据 

    3. 点击时 选项卡效果 (字体颜色, 小三角方向)

    4.大功告成 ! 

    .步骤

    1. 首先我们先写一个底部可以滑动的视图 

    头部

    这个是JS文件的头我们需要引入这些.剩下的代码如下

    底部滑动栏图1 底部滑动栏图2 底部滑动栏图3 底部滑动栏图4

    以上代码是公司大牛写的,我是借鉴而来 毕竟我是初来炸道(╯‵□′)╯炸弹!

    然后 外界写上方选项卡布局, 和调用这个滑动栏 , 直接上代码

    最后的布局 你们自己写吧 我懒得贴上去了,,, 然后大功告成!   第一天小计

    相关文章

      网友评论

          本文标题:React-native 小计第一天(筛选栏的实现)

          本文链接:https://www.haomeiwen.com/subject/vzcskxtx.html