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

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


筛选图片1

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

.思路

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

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

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

4.大功告成 ! 

.步骤

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


头部

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


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

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

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


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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容