(六) 盘古UI,深度封装flexbox,PanguFlexBoxView轻松实现各种tag类型,让快速开发更自由!

盘古UI,较为全面的自定义UI框架,帮助你绝对的快速开发!(长期维护中)

demo地址,点击查看github

盘古PanguFlexBoxView

可以实现各种tag类型的UI需求,包含颜色和点击选中等!

1, 样例展示图

图-1	图-2	图-3

2, 介绍

标签布局,盒子布局,实现各中tag标签的展示和点击,可以自定义样式!

base类方法介绍列表:

attr属性	方法 method	介绍 introduction
flex_direction	setFlexDirection(@FlexDirection int flexDirecti)	方向 row,row_reverse,column,column_reverse
flex_enable	etEnable(boolean enable)	可用状态
flex_wrap	setFlexWrap(@FlexWrap int flexWrap)	nowrap ：不换行 wrap：按正常方向换行 wrap_reverse：按反方向换行
flex_item_margin	setItemMargin(int margin)	item间距
flex_select_mode	setSelectMode(@PanguFlexSelectMode int flexSelectMode)	选择模式 single 单选,multiple 多选,oneMost 最多选择一个,oneLeast最少选择一个 参考PanguFlexSelectMode
flex_item_text_gravity	setItemTextGravity(int gravity)	参考Gravity
--------	showInputAt(int index, boolean isShow)	在哪里展示输入框
--------	setDataText(List list, OnItemClickListener listener)	展示普通文本item,可自定义item布局,默认 R.layout.item_flex_box_text
--------	setDataText(List list, int itemLayoutId, OnItemClickListener listener)	展示普通文本item,可自定义item布局,默认 R.layout.item_flex_box_text
--------	setDataCb(List list)	设置checkBox样式的item数据,监听可以单独调取{@link #setOnItemCheckedListener(OnItemCheckedListener)}
--------	setDataCb(List list, OnItemCheckedListener listener)	设置checkBox样式的item数据 带监听
--------	setDataCb(List list, OnItemCheckedListener listener, TextWatcherListener textWatcher)	设置checkBox样式的item数据 带监听 默认item item_flex_box_cb
--------	setDataCb(List list, int itemLayoutId)	设置checkBox样式的item数据,监听可以单独调取{@link #setOnItemCheckedListener(OnItemCheckedListener)}
--------	setDataRb(List list, OnItemCheckedListener listener, TextWatcherListener textWatcher)	设置RadioButton样式的item数据,带监听
--------	setDataRb(List list, OnItemCheckedListener listener)	设置RadioButton样式的item数据,带监听
--------	setDataRb(List list)	设置RadioButton样式的item数据
--------	setDataRb(List list, int itemLayoutId)	设置RadioButton样式的item数据,监听可以单独调取{@link #setOnItemCheckedListener(OnItemCheckedListener)}
--------	int getFlexItemCount()	获取item的总条数
--------	List getCheckedItem()	获取已选中的item

3, 使用示例

1,布局文件

     <com.smart.pangu_ui_lib.widget.PanguFlexBoxViewandroid:layout_width="match_parent"android:id="@+id/pg_flex_box4"app:flex_select_mode="multiple"android:minHeight="50dp"android:layout_height="wrap_content" />

2,代码逻辑-准备数据

   //准备数据public static List<SelectItem> getSelectItems() {ArrayList<SelectItem> selectItems = new ArrayList<>();selectItems.add(new SelectItem("0", "PanguUI框架"));SelectItem android = new SelectItem("1", "Android");android.setShowInput(true);android.setInputContent("这是安卓....");selectItems.add(android);selectItems.add(new SelectItem("2", "Java"));selectItems.add(new SelectItem("3", "Php"));selectItems.add(new SelectItem("4", ".net",true));selectItems.add(new SelectItem("5", "H5"));selectItems.add(new SelectItem("6", "C++"));selectItems.add(new SelectItem("7", "JavaScript"));selectItems.add(new SelectItem("8", "Python"));return selectItems;}

3,设置数据

    mPgFlexBox4.setDataCb(UserUtil.getSelectItems(), new   PanguFlexBoxView.OnItemCheckedListener() {@Overridepublic void onItemCheck(SelectItem item, int position, boolean currentItemChecked) {showToast("当前" + (currentItemChecked ? "选择了" : "取消选择了") + ":position=" + position + ",name=" + item.getName());}});

4, 代码封装心得

根据自己的业务需求和自己使用app的体验封装和开发了常用的功能方法,不足之处多多指正!
欢迎来一起探讨封装之路!

5, 获取地址

demo地址,点击查看github
欢迎您扫码安装体验demo