Android -- 案例学习积累

Theme

ActionBar / ToolBar

android.support.design.widget.CollapsingToolbarLayout

android.support.design.widget.AppBarLayout

 

 

@、Theme

1、设置NoActionBar

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">#3F51B5</item>
        <!-- Light Indigo -->
        <item name="colorPrimaryDark">#3949AB</item>
        <!-- Dark Indigo -->
        <item name="colorAccent">#00B0FF</item>
        <!-- Blue -->
    </style>
    <style name="AppTheme" parent="AppTheme.Base"></style>
</resources>

 

 

@、ActionBar / ToolBar

1、Theme设置为NoActionBar，Layout文件中添加

        <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:layout_scrollFlags="scroll|enterAlways"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />    

然后再代码中设置此Toolbar为ActionBar

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar); // 设置ActionBar
        ActionBar supportedActionBar = getSupportActionBar();
        if(supportedActionBar != null){
            // 设置向上导航的图标。默认为向左的箭头
            supportedActionBar.setHomeAsUpIndicator(R.drawable.ic_menu_white_24dp);
            // 设置是否显示向上导航: true显示，false不显示；默认为false.
            supportedActionBar.setDisplayHomeAsUpEnabled(true);
        }        

相关知识：

a、如果没有在onOptionsItemSelected中对android.R.id.home进行处理，则：在AndroidManifest中相应的activity指定了android:parentActivityName，就返回到parentActivity，否则什么都不做。

b、如果是返回parentActivity，则parentActivity会onDestroy, onCreate, onStart, onResume执行一遍。而如果是按返回键，则只是(onStart), onResume。对于主界面有Tab页的时候要注意考虑这种情况。

c、在onOptionsItemSelected进行判断，如果是android.R.id.home，则直接调用finish()，这样也可以到达按返回键的效果。当然如果onBackPressed()没有做特殊处理的话，也可以调用onBackPressed()。

d、应用场景：使用此方法为侧边导航栏添加指示器。

 

@、android.support.design.widget.CollapsingToolbarLayout

1、对Tookbar进行包装。

2、如果collaspsingToolbarLayout的app:layout_scrollFlags设置为exitUntilCollasped，则对子控件设置app:layout_collapseMode：pin(固定不动，Toolbar上的向上导航和菜单按钮不会消失), parallax(随着CollapsingToolbarLayout移动而移动，Toolbar上的向上导航和菜单按钮会消失)，不过最后的高度和宽度就是Toobar的高度和宽度。

3、app:contentScrim指定了最终显示的内容。

 

@、android.support.design.widget.AppBarLayout

原来这些实现是需要CoordinatorLayout的配合，在使用中竟然没有注意到这点，看了这篇文章，总算有所明白了：Handling Scrolls with CoordinatorLayout。

1、对子控件设置app:layout_scrollFlags：sroll(向上滑(滚动条向下滑)，子控件一起向上滑), enterAlways(向下滑(滚动条向上滑)，不管滚动条是否滑到顶，子控件都出现，如果不指定该值，则要等滚动条滑到顶，子控件才会出现), enterAlwaysCollasped(这个没有测试出有什么用？？), exitUntilCollasped(结合CollapsingToolbarLayout使用，如果CollapsingToolbarLayout的Toolbar把app:layout_collapseMode设置为pin，则该Toolbar上的向上导航和菜单按钮不会消失)。

示例一：AppBarLayout + Toolbar + TabLayout，滑动时Toolbar隐藏，Tab标签保留

       <android.support.design.widget.AppBarLayout
            android:id="@+id/appbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
                                  <!-- 配合Theme设置为Theme.AppCompat.Light.NoActionBar使用，这样ActionBar的文字就是浅色的了 -->

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:layout_scrollFlags="scroll|enterAlways"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

            <android.support.design.widget.TabLayout
                android:id="@+id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />
        </android.support.design.widget.AppBarLayout>    

 

示例二： AppBarLayout + CollapsingToolbarLayout + Toolbar

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="256dp"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            android:theme="@style/ThemeOverlay.AppCompat.Dark"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleMarginEnd="72dp"
            app:expandedTitleMarginStart="16dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                android:id="@+id/image"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"
                tools:background="@drawable/a"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="parallax"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

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