WidgetLayout：一組繼承於 ViewGroup 的自定義容器集合

WidgetLayout 介紹

WidgetLayout是一組繼承於 的自定義容器集合， 目前實現了以下實用容器:

支持水平布局，並自適應換行，可限定每行最少和最多Item 數，行內容可水平和垂直居中。

繼承自 ,以 方式提供內容，有簡單的回收復用機制，有Item 點擊監聽。

以等分列方式布局，每列可設置內容居左，中，右，及鋪滿，可設置最小最大列寬高限定。

支持列表的嵌套滑動和指定子 懸停，像 。

可水平垂直方向布局和滑動吸頂等，無需嵌套; 支持 和 的交互和介面。

在 上擴展支持 場景交互和各種UI 定製。

實現背景

開發中為了實現特定的組合布局，我們會用功能鮮明的4大常用布局去嵌套實現，增加了嚴重OverDraw的機率；

布局功能強大但是 過程複雜(每次執行onMeasure 所有直接子 View 會有兩次measure)

面對複雜交互可能需要寫一堆與業務無關的晦澀邏輯，工作量比開發業務繁重，比如滑動控制項的懸停或聯動；

在有分割線或是邊界線的視覺需求時，很多人常用 來實現，即消耗了內存，又影響了測繪時間。

常用容器控制項還沒有對自身做最大寬高限定的，經常見到的等分布局，常用多層支持不同方向 來實現。

希望容器有一個共通的基類，便於日後統一處理一些事情，比如監控性能打點等。

針對以上問題結合常用的使用場景編寫了以上的幾種容器組件,類結構圖如下：

適合的使用場景舉例 按需要選擇，減少布局嵌套和額外複雜的交互代碼。

任何需要對容器自身或對直接子 View 的最大寬高限定以及支持 布局，都可適當選擇以下容器。

任何需要對容器描邊和子 間畫分割線的，需要像ios 按下自帶蒙層的效果可使用繼承於 的容器，像 。

和 適用於以行方式布局子控制項，並能自適應大小自動換行，方便設置行最少最多的 個數和行居中，

是特別適合列布局，等分布局的使用場景，方便調整每列的 方式（左中右）和全鋪滿，或按child自已的 在所在列的格子里來布局，

適合嵌套滑動的列表，類似NestScrollView 。

可替代 少嵌套，可設置任意子 滑動懸停在開始和結束位置，可不限定子 大小像 一樣選中居中和滑動的交互。

是完全可替代支持不同方向的 並能提供更多的布局約束，和背景，描邊，分割等額外裝飾。

Demo 示例效果

Demo 入口 和 的演示效果。

GIF/926K

`WrapLayout`和`LabelLayout` `ColumnLayout`的演示效果。的演示效果。

GIF/439K

GIF/483K

`PageScrollView`和`PageScrollTab`的使用示例。

GIF/307K

GIF/300K

如何使用：XML 屬性和 API 簡介通用屬性說明和介紹

注;所有xml 中使用自定義屬性的地方，請在根標籤中加上

1. 所有容器自身和子 對於 支持。

a. 容器控制項自身標籤下使用 ,即可支持容器內容的align 屬和最大寬與高的限制。 java 代碼可通過 , , 來支持。

b. 容器直接子 使用 即可支持直接子 在容器內的 和自身大小的限制。 java 代碼可通過

2. 部分容器 和 的應用，僅限於繼承於 的容器

a. xml 中使用支持 屬性和解釋如下,java 都有對應的set 和get 方法:

-hover drawable 忽略手勢滑動到自身之外取消按下狀態-->

b. xml 中使用支持 屬性和解釋如下,java 都有對應的set 和get 方法:

具體容器組件的屬性和使用介紹

1. xml 屬性支持屬性如下：java 都有對應的set 和get 方法就不給示例了。

2. 繼承 有其所有功能介面。

不同是支持 在xml 中設置Label 的字型大小和字色。同樣可用java 代碼設置字型大小字色。 使用可通過 介面來初始化 ,本工程中的示例初始化如下。

final String[] mLabels = new String[]{ "A", "B", "C", "D", "E", "F", "G", "H" }; labelLayout.setItemProvider(new ItemProvider.ViewProvider() { @Override public int getViewType(int position) { return 0; } @Override public View getView(int position, View convertView, ViewGroup parent) { return buildView(getTitle(position),true); } @Override public CharSequence getTitle(int position) { return mLabels[position]; } @Override public Object getItem(int position) { return mLabels[position]; } @Override public int getCount() { return mLabels == null ? 0 : mLabels.length; } }); final LabelLayout.OnLabelClickListener mLabelClicker = new LabelLayout.OnLabelClickListener() { @Override public void onLabelClick(LabelLayout parent, View labelView) { Object tag = labelView.getTag(); CharSequence text = tag == null ? null : String.valueOf(tag); if (text == null && labelView instanceof TextView) { text = ((TextView) labelView).getText(); } if (text != null) { Toast.makeText(getActivity(), text, Toast.LENGTH_SHORT).show(); } } }; mLabelLayout.setOnLabelClickListener(mLabelClicker);

3. xml 屬性支持屬性如下：java 都有對應的set 和get 方法就不給示例了。

4. xml 屬性支持屬性和 java 代碼如下：

``` `java`代碼可如下設置：mLastFloatLayout.setNestViewId(viewId); mLastFloatLayout.setFloatViewId(viewId); 或 mLastFloatLayout.setNestViewIndex(viewIndex); mLastFloatLayout.setFloatViewIndex(viewIndex);

5. 使用.

a. 支持的xml 屬性，對應都有java 相應的set 和 get;

b.java 其它介面設置

//接著上面 mPageScrollView.setPageHeadView(headerView); //設置頭部 View mPageScrollView.setPageFooterView(footerView); 設置尾部 View //設置 PageTransformer 動畫，實現滑動視圖的變換。 mPageScrollView.setPageTransformer(new PageScrollView.PageTransformer() { @Override public void transformPage(View view, float position, boolean horizontal) { //在這裡根據滑動相對偏移量 position,實現該視圖的動畫效果。 } @Override public void recoverTransformPage(View view, boolean horizontal) { //清除視圖的動畫效果，在setPageTransformer(null)時會調用。 } }); PageScrollView.OnPageChangeListener pagerScrollListener = new PageScrollView.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { // ViewPager 滑動視圖時，相對偏移適時回調。 } @Override public void onPageSelected(int position, int oldPosition) { // ViewPager 模式時 選中回調。 } @Override public void onScrollChanged(int scrollX, int scrollY, int oldScrollX, int oldScrollY) { //視圖滑動回調 View.onScrollChanged } @Override public void onScrollStateChanged(int state, int oldState) { //state 的取值如下，標明著容器的滑動狀態。 // SCROLL_STATE_IDLE = 0; // 滑動停止狀態。 // SCROLL_STATE_DRAGGING = 1;//用戶正開始拖拽滑動 。 // SCROLL_STATE_SETTLING = 2;//開始鬆開手指快速滑動。 } }; mPageScrollView.setOnPageChangeListener(pagerScrollListener); // 設置視圖滾動的監聽。 mPageScrollView.setOnScrollChangeListener(pagerScrollListener); //設置可見子 View 發生變化時 可見索引區間的監聽。 mPageScrollView.setOnVisibleRangeChangeListener(new OnVisibleRangeChangeListener(){ public void onVisibleRangeChanged(int firstVisible, int lastVisible, int oldFirstVisible, int oldLastVisible){ } }); //設置動畫初始化滑動到第二個 View ，-1 表示動畫時間內部計算，如無需動畫傳0 mPageScrollView.scrollTo(1,0,-1);

c. 繼承於 ，額外支持以下xml 屬性（java 均有get 和set 對應）。

java 額外的介面：

//設置ItemProvider，初始化選中第0 個索引， 類似上面的 LabelLayout 的初始化。 mPageScrollTab.setTabProvider(mItemProvider,0); mPageScrollTab.setTabClickListener(new PageScrollTab.ITabClickEvent() { @Override public boolean onTabClicked(PageScrollTab parent, View cur, int curPos, View pre, int prePos) { return false; } });

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！