Checkbox、RadioButton总结

RadioButton

Radiobutton去掉圆圈

1	android:button="@null"

改变圆圈样式，自定义shape

1	android:drawableLeft、Right、Top、Bottom 调用该图片

创建selector，设置check 属性对应的图片即可
选中的设置 checked、selected属性
默认的不用设置属性(一定要放在最下面)

1
2
3

<item android:state_selected="true" android:drawable="@drawable/选中的图" />
<item android:state_checked="true" android:drawable="@drawable/选中的图" />
<item android:drawable="@drawable/不选中的图" />

@Override
public void onClick(View v) {

    if(index == 0){
        btn1.setSelected(true);
        btn2.setSelected(false);
            .
            .
        btn10.setSelected(false);
    }
}

RadioButton实现靠右布局

背景
RadioGroup由于是继承LinearLayout，无法使RadioButton靠右布局。
可以在两个button间添加width为0dp的space实现RadioButton靠右

<RadioGroup
        android:id="@+id/rgHandleButtons"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/llContainer"
        android:background="@color/common_system_style_gray"
        android:orientation="horizontal"
        android:paddingBottom="@dimen/common_layout_margin_15dp"
        android:paddingTop="@dimen/common_layout_margin_15dp"
        android:visibility="@{data.holiday.status==HandleHolidayStatus.NONE.getValue()&&data.getHoliday().getAudittype() ==HolidayAuthType.CHECK.getValue()?View.VISIBLE:View.GONE}">

        <RadioButton
                android:id="@+id/btnAgree"
                android:layout_width="110dp"
                android:layout_height="44dp"
                android:layout_alignParentLeft="true"
                android:layout_marginLeft="27.5dp"
                android:background="@drawable/common_button_enable_bg_shape"
                android:button="@null"
                android:gravity="center"
                android:text="@string/common_text_agree"
                android:textColor="@color/common_text_white"
                android:textSize="@dimen/text_size_17dp"
                android:visibility="@{data.holiday.status==HandleHolidayStatus.NONE.getValue()?View.VISIBLE:View.GONE}" />

        <Space
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1" />


        <RadioButton
                android:id="@+id/btnDisagree"
                android:layout_width="110dp"
                android:layout_height="44dp"
                android:layout_alignParentRight="true"
                android:layout_gravity="right"
                android:layout_marginRight="27.5dp"
                android:background="@drawable/teach_kq_button_enable_bg_shape"
                android:button="@null"
                android:gravity="center"
                android:text="@string/common_text_disagree"
                android:textColor="@color/common_text_red"
                android:textSize="@dimen/text_size_17dp"
                android:visibility="@{data.holiday.status==HandleHolidayStatus.NONE.getValue()?View.VISIBLE:View.GONE}" />

</RadioGroup>

Checkbox

总结
选中效果必须与HashMap、HashSet等结合使用

1.在item点击事件里将position、数据保存在hashmap即可。
2.通过判断HashMap里面是否含有该值来设置是否选中。

示例 - ListView中实现单选

使用一个ImageView代替Checkbox
创建一个HashMap<Integer,Long> //通过position做key保存id
在点击事件里，每点击一次将原有的数据清空，再重新加入值(保证hashmap集合只包含一个值。)

convertView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        selectItem.clear(); //清空原有的数据，保证单选
        selectItem.put(position,user.getUserId());
        mAdapter.notifyDataSetChanged();
    }
});

if(selectIten.keySet().contains(position)){
    holder.ivCheck.setVisibility(View.VISIBLE);
}else{
    holder.ivCheck.setVisibility(View.GONE);
}

SearchView

CardView

属性	说明
app:contentPadding	卡片的内边距
app:cardCornerRadius	卡片的圆角大小
app:cardElevation	阴影的大小
app:cardMaxElevation	阴影最大高度
app:cardBackgroundColor	卡片背景色
app:cardUseCompatPadding=”true”	使其显示卡片的样式
app:cardPreventCornerOverlap=”true”	在V20和之前的版本中添加内边距，防止内容和边角的重叠

理解
1.CardView(卡片布局)是继承FrameLayout的一个ViewGroup。
2.将子ViewGroup放在其标签中即有卡片的效果。

PhotoPick

步骤
1.复制photopick文件包
2.修改Gradle、AndroidManifest(PhotoPickActivity改成有ActionBar的主题)、ImageLoader以及PhotoDetail布局文件里的自定义View。
3.复制anim、drawable、menu、strings、dimen、layout

Switch更换滑块的颜色

<android.support.v7.widget.SwitchCompat
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_centerVertical="true"
    android:layout_marginRight="@dimen/margin_15dp"
    android:checked="true"
    app:theme="@style/SwitchStyle"
    app:thumbTint="@color/text_color_selector_blue_white" />

//更换滑块的颜色
<style name="SwitchStyle" parent="Theme.AppCompat.Light">
    <item name="colorControlActivated">#02c1c9</item>
    <item name="colorSwitchThumbNormal">#cc0000</item>
</style>

ToolBar是Google基于Android5.0新推出的一个标题栏控件。它是基于Material Design设计的。极具灵活性。
通常与CoordinatorLayout、AppBarLayout联合使用。达到滑动隐藏的效果。

实例 - 滑动隐藏标题栏

滑动隐藏标题栏必须以CoordinatorLayout为根布局。

<!-- 比较基本的一个滑动关闭标题栏的代码 -->
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="io.tanjungang.github.social.video.VideoFragment">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/main.toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <TextView
            android:id="@+id/tvTest"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true" />

    </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

public class TestActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);
        TextView tvTest = (TextView) findViewById(R.id.tvTest);
                // 这里的text应该超过屏幕使其可以滑动
        String text = "fasdhjfkhasdjkhfjkasdhjklfyasdjyfoeuiwyruioyqweoiryqouiwey。。";
        tvTest.setText(text);
    }
}

AppBarLayout属性
app:contentScrim=”” 可以设置折叠后的toolBar的颜色
app:layout_scrollFlags=”” 可以在某个滚动View（一般是Scrollview）滚动时使其子View进行改变.
值snap: 根据view显示的多少决定是展开还是收缩。
值scroll：可以使子View跟随滚动事件。(相当于将该View作为Scrollview的Header)
值enterAlways：有下滑操作时，让子View立即显示。一般结合scroll使用（即可显示，由上往下切入）
值enterAlwaysCollapsed：下滑时，先显示ToolBar，直到滑到顶端才显示完整的layout。需设置minheight
值exitUntilCollapsed：AppBarLayout折叠，背景消失，ToolBar保留。

NestedScrollView如何绑定AppBarLayout呢，需要用到CoordinatorLayout的behavior属性。app:layout_behavior=”@string/appbar_scrolling_view_behavior”

CollapsingToolbarLayout属性
app:layout_collapseMode=”” 可以设置子View的标识使其产生某种行为。
pin：有该标志位的View在页面滚动的过程中会一直停留在顶部，比如Toolbar可以被固定在顶部。
parallax：有该标志位的View表示能和页面同时滚动。与该标志位相关联的一个属性是：layout_collapseParallaxMultiplier，该属性是视差因子，表示该View与页面的滚动速度存在差值，造成一种相对滚动的效果。

<!-- app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed" 效果 -->

<android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <android.support.design.widget.CollapsingToolbarLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:minHeight="200dp"
                    app:contentScrim="#e74c3c"
                    app:expandedTitleMarginEnd="64dp"
                    app:expandedTitleMarginStart="48dp"
                    app:layout_scrollFlags="scroll|enterAlwaysCollapsed|enterAlways">


                    <android.support.v7.widget.Toolbar
                            android:id="@+id/main.toolbar"
                            android:layout_width="match_parent"
                            android:layout_height="?attr/actionBarSize"
                            android:minHeight="?attr/actionBarSize"
                            app:title="TanJunDang" />
            </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

<!-- app:layout_scrollFlags="scroll|exitUntilCollapsed" -->
<!-- 折叠layout保持ToolBar位于顶部 -->
<android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minHeight="200dp"
            app:contentScrim="#e74c3c"
            app:expandedTitleMarginEnd="64dp"
            app:expandedTitleMarginStart="48dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <android.support.v7.widget.Toolbar
                android:id="@+id/main.toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:minHeight="?attr/actionBarSize"
                app:title="TanJunDang" />
        </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

BottomNavigationView的使用

理解
使用BottomNavigationView可以快速实现底部Tab的效果。
主要有下列属性
修改整个layout的背景色 app:itemBackground=”@color/color_white”
修改每个icon的颜色 app:itemIconTint=”@color/base_theme_color”
修改每个文本的颜色 app:itemTextColor=”@color/base_theme_color”
加载menu布局用于设置tab app:menu=”@menu/navigation”

使用
1.XML定义BottomNavigationView。
2.使用app：menu加载menu
3.修改tab里item的icon以及text。在res/color下新建selector，用于修改item的icon、text。使用ColorStateList加载上述selector即可。

<!-- 1.定义BottomNavigationView -->
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.zhkj.syq.MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <FrameLayout
            android:id="@+id/flContent"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"></FrameLayout>

        <android.support.design.widget.BottomNavigationView
            android:id="@+id/bottomTab"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_gravity="bottom"
            android:background="?android:attr/windowBackground"
            app:itemBackground="@color/color_white"
            app:itemIconTint="@color/base_theme_color"
            app:itemTextColor="@color/base_theme_color"
            app:menu="@menu/navigation" />

    </LinearLayout>

<!-- 结合CoordinatorLayout、CircleImageView实使用现底部中间凸起按钮 -->
    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/ivMoney"
        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_gravity="bottom|center"
        android:src="@drawable/share_money_icon" />

</android.support.design.widget.CoordinatorLayout>

<!--2. Menu布局 navigation.xml -->
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:id="@+id/tab_home"
        android:icon="@drawable/ic_home_selector"
        android:title="首页" />

    <item
        android:id="@+id/tab_classify"
        android:icon="@drawable/ic_classify_selector"
        android:title="分类" />

    <item
        android:id="@+id/tab_money"
        android:checkable="false"
        android:title="" />

    <item
        android:id="@+id/tab_chat"
        android:icon="@drawable/ic_chat_selector"
        android:title="聊天" />

    <item
        android:id="@+id/tab_mine"
        android:icon="@drawable/ic_mine_selector"
        android:title="我的" />

</menu>

<!-- 3.定义selector修改icon的颜色以及文本的颜色 -->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/base_theme_color" android:state_pressed="true"></item>
    <item android:color="@color/base_theme_color" android:state_selected="true"></item>
    <item android:color="@color/base_theme_color" android:state_checked="true"></item>
    <item android:color="@color/base_theme_color" android:state_focused="true"></item>
    <item android:color="@color/tab_text_color_disable"></item>
</selector>

Resources resource = getBaseContext().getResources();
ColorStateList csl = resource.getColorStateList(R.color.tab_text_color_selector);
bottomTab.setItemTextColor(csl);
bottomTab.setItemIconTintList(csl);
bottomTab.setSelectedItemId(R.id.tab_home);

// 去掉item超过3个时bottomView的动画。
public class BottomNavigationViewTool {

    public static void disableShiftMode(BottomNavigationView navigationView) {

        BottomNavigationMenuView menuView = (BottomNavigationMenuView) navigationView.getChildAt(0);
        try {
            Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
            shiftingMode.setAccessible(true);
            shiftingMode.setBoolean(menuView, false);
            shiftingMode.setAccessible(false);

            for (int i = 0; i < menuView.getChildCount(); i++) {
                BottomNavigationItemView itemView = (BottomNavigationItemView) menuView.getChildAt(i);
                itemView.setShiftingMode(false);
                itemView.setChecked(itemView.getItemData().isChecked());
            }

        } catch (NoSuchFieldException | IllegalAccessException e) {
            e.printStackTrace();
        }
    }
}