1. 程式人生 > >Android快速開發控制元件---下拉導航選單

Android快速開發控制元件---下拉導航選單

LQRDropdownLayout

該專案是下拉導航選單,使用非常簡單。基於FilterDropDownMenu-master專案進行封裝,因為原專案的使用太複雜了,光佈局就得幾十行程式碼,如果專案中多處用到下拉選單,那程式碼的冗餘度就太大了,故本佈局對其進行精簡,並增加更多效果(如:選中時條目的背景及旁邊的圖示都可自定義等),使用時僅僅只要2個步驟:

1、設定佈局

<com.lqr.layout.LQRDropdownLayout
    android:id="@+id/dl"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:ddl_item_selected__drawable="@mipmap/ic_task_status_list_check"
    app:ddl_item_text_gravity="left"
    app:ddl_list_max_height="250dp"
    app:ddl_top_btn_noraml_drawable="@mipmap/ic_dropdown_normal"
    app:ddl_top_btn_selected_drawable="@mipmap/ic_dropdown_actived"/>

2、程式碼控制

LQRDropdownLayout mDl = (LQRDropdownLayout) findViewById(R.id.dl);
mDl.setCols(2);

//建立內容區
TextView tv = new TextView(this);
tv.setText("我是內容,可以是View,也可以是ViewGroup");

//建立下拉列表資料
final List<Map<String, String>> listData = new ArrayList<>();
for (int i = 0; i < mDl.getCols(); i++) {
    //這裡使用LinkedHashMap是為了讓下拉列表的條目有序
    Map<String, String> map = new LinkedHashMap<>();
    for (int j = 0; j < 6; j++) {
        map.put("name " + j, "value " + j);
    }
    listData.add(map);
}

//初始化(該方法必須呼叫)
mDl.init(tv, listData);
//設定選單點選監聽
mDl.setOnDropdownListListener(new LQRDropdownLayout.OnDropdownListListener() {
    @Override
    public void OnDropdownListSelected(int indexOfButton, int indexOfList, String textOfList, String valueOfList) {

    }

    @Override
    public void onDropdownListOpen() {

    }

    @Override
    public void onDropdownListClosed() {

    }
});

3、可實現的效果如下:

這裡寫圖片描述

這裡寫圖片描述

4、其他設定

由於該控制元件的可自定義屬性太多,這裡就一一舉例了,請看其自定義屬性

<resources>
<declare-styleable name="DropdownLayout">
    <!--下拉列表的列數-->
    <attr name="ddl_cols" format="integer"/>
    <!--下拉按鈕與下拉列表中只顯示一個,如果在下拉列表中選擇了item5,則item5消失,下拉按鈕顯示item5的name-->
    <attr name="ddl_only_show_one" format="boolean"/>

    <!--下拉按鈕區背景-->
    <attr name="ddl_top_bg" format="color"/>
    <!--下拉按鈕區的高度-->
    <attr name="ddl_top_height" format="dimension"/>
    <!--下拉按鈕區的分割線顏色-->
    <attr name="ddl_top_split_line_color" format="color"/>
    <!--下拉按鈕區的分割線寬度-->
    <attr name="ddl_top_split_line_width" format="dimension"/>
    <!--下拉按鈕區的分割線高度-->
    <attr name="ddl_top_split_line_height" format="dimension"/>

    <!--下拉按鈕文字字首-->
    <attr name="ddl_top_btn_text_prefix" format="string"/>
    <!--下拉按鈕文字字尾-->
    <attr name="ddl_top_btn_text_suffix" format="string"/>
    <!--下拉按鈕文字大小-->
    <attr name="ddl_top_btn_text_size" format="dimension"/>
    <!--下拉按鈕未選中時文字顏色-->
    <attr name="ddl_top_btn_text_normal_color" format="color"/>
    <!--下拉按鈕選中時文字顏色-->
    <attr name="ddl_top_btn_text_selected_color" format="color"/>
    <!--下拉按鈕文字未選中時顯示的圖示-->
    <attr name="ddl_top_btn_selected_drawable" format="reference"/>
    <!--下拉按鈕文字選中時顯示的圖示-->
    <attr name="ddl_top_btn_noraml_drawable" format="reference"/>

    <!--下劃線寬度-->
    <attr name="ddl_top_bottom_line_width" format="dimension"/>
    <!--下劃線高度-->
    <attr name="ddl_top_bottom_line_height" format="dimension"/>
    <!--下劃線顏色-->
    <attr name="ddl_top_bottom_line_color" format="color"/>

    <!--分割線顏色-->
    <attr name="ddl_split_line_color" format="color"/>
    <!--分割線寬度-->
    <attr name="ddl_split_line_width" format="dimension"/>
    <!--分割線高度-->
    <attr name="ddl_split_line_height" format="dimension"/>

    <!--遮蓋層顏色-->
    <attr name="ddl_mask_bg" format="color"/>

    <!--下拉列表的最大高度-->
    <attr name="ddl_list_max_height" format="dimension"/>

    <!--下拉列表item的左內間距-->
    <attr name="ddl_item_padding_left" format="dimension"/>
    <!--下拉列表item的右內間距-->
    <attr name="ddl_item_padding_right" format="dimension"/>
    <!--下拉列表item的高度-->
    <attr name="ddl_item_height" format="dimension"/>
    <!--下拉列表item文字大小-->
    <attr name="ddl_item_text_size" format="dimension"/>
    <!--下拉列表item未選中時文字顏色-->
    <attr name="ddl_item_text_normal_color" format="color"/>
    <!--下拉列表item選中時文字顏色-->
    <attr name="ddl_item_text_selected_color" format="color"/>
    <!--下拉列表item未選中時背景顏色-->
    <attr name="ddl_item_normal_bg" format="color"/>
    <!--下拉列表item選中時背景顏色-->
    <attr name="ddl_item_selected_bg" format="color"/>
    <!--下拉列表item未選中圖示-->
    <attr name="ddl_item_normal_drawable" format="reference"/>
    <!--下拉列表item選中圖示-->
    <attr name="ddl_item_selected__drawable" format="reference"/>
    <!--下拉列表item的文字位置-->
    <attr name="ddl_item_text_gravity">
        <enum name="center" value="0"></enum>
        <enum name="left" value="1"></enum>
        <enum name="right" value="2"></enum>
    </attr>

    <!--下拉列表item下劃線高度-->
    <attr name="ddl_item_bottom_line_height" format="dimension"/>
    <!--下拉列表item下劃線左邊距-->
    <attr name="ddl_item_bottom_line_margin_left" format="dimension"/>
    <!--下拉列表item下劃線右邊距-->
    <attr name="ddl_item_bottom_line_margin_right" format="dimension"/>
    <!--下拉列表item下劃線顏色-->
    <attr name="ddl_item_bottom_line_color" format="color"/>

</declare-styleable>
</resources>

5、GitHub地址: