1、首先我们想到的会是自定义Flex4中 的spark组建TabBar的外观
2、创建TabBar的skin,将代码中
<s:DataGroup id="dataGroup" width="100%" height="100%">
<s:layout>
<s:ButtonBarHorizontalLayout gap="-1"/>
</s:layout>
<s:itemRenderer>
<fx:Component>
<s:ButtonBarButton skinClass="spark.skins.spark.TabBarButtonSkin" />
</fx:Component>
</s:itemRenderer>
</s:DataGroup>
改为
<s:DataGroup id="dataGroup" width="100%" height="100%">
<s:layout>
<s:TileLayout id="titleLay" horizontalGap="-1" verticalGap="-1" />
</s:layout>
<s:itemRenderer>
<fx:Component>
<s:ButtonBarButton skinClass="spark.skins.spark.TabBarButtonSkin" label="{data}" width="100%"
/>
</fx:Component>
</s:itemRenderer>
</s:DataGroup>
3、TitleLayout 有一些属性 columnWidth可以设置每个单元格的大小,记得将ButonBarButton的大小改为100%,这样一个自动换行功能的TabBar就完成了,当TabBar中的标题非常多的时候非常有用
4、如果您有更好的做法或建议请指正,谢谢……
5、本例子代码见附件。
- 大小: 5.6 KB
分享到:
相关推荐
flex4 TabBar skin
NULL 博文链接:https://jzzwy.iteye.com/blog/1738572
Sample-Flex4-TabBar使用例子。
1、TabActivity实现底部Tabbar 2、Fragment底部实现 3、ViewPager Tabbar滑动式心啊
自定义tabbar的功能 实现页面切换 按钮自定义回调 可真机或模拟器运行
这是一个自定义的TabBar样式,实现TabBar中间凸起“ ”按钮
1、使用TabActivity实现Tabbar 2、使用Fragment实现Tabbar 3、ViewPager实现可滑动Tabbar
著名的flex-tabbar 使用 TabBar 为 famo.us 提供的 TabBar 小部件演示。 教程 建造 要构建演示,请确保全局安装了 grunt、webpack 和 webpack-dev-server: npm install -g grunt npm install -g webpack npm ...
类似iOS的Tabbar的Android实现:1、使用RadioGroup 2、自定义实现,扩展性强
IOS实现中间凸起圆形TabBar,类似于闲鱼的效果
几代码实现导航栏透明渐变、实现TabBar中间凸起;可自定义
tabbar上按钮位置控制,tabbar按钮实现居中
非常全的左右滑动的,自定义的tabbar的例子,绝对能对你的项目有帮助
flex tab bar samples
tabbar 简单实现的选项卡切换
swift实现tabbar.zip,AdaptiveController is a 'Progressive Reduction' Swift UI module for adding custom states to Native or Custom iOS UI elements. Swift UI component by @Ramotion - ...
Flutter TabBar SliverAppBar PageView NestedScrollView
Flutter自定义TabBar的Indicator 实现秒杀Tab效果
主要介绍了iOS开发中TabBar再次点击实现刷新效果,实现方法也很简单,需要的朋友可以参考下