Skip to content

利用Material Support这个强大的库来实现卡片式布局、悬浮按钮和可交互性提示、滑动菜单和可折叠式标题栏,添加定位、登陆、电话、好友等功能

License

Notifications You must be signed in to change notification settings

wanghao15536870732/MaterialTest

Repository files navigation

MaterialTest

最佳的UI体验—————Material Design 实战\

动态演示 本人
enem. . .凑合

还有解决RecyclerView遮住Toolber的问题
请访问本人de博客
或着本人de简书

点击每一种水果后就会跳转到FruitActivity上面,并且利用
可折叠标题栏<android.support.design.widget.CollapsingToolbarLayout
卡片式布局<android.support.design.widget.CoordinatorLayout
悬浮按钮<android.support.design.widget.FloatingActionButton
形成精美的布局页面

布局代码如下:

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@ id/appBar"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:fitsSystemWindows="true">
        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@ id/collapsing_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:contentScrim="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            android:fitsSystemWindows="true">

            <ImageView
                android:id="@ id/fruit_image_view"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                app:layout_collapseMode="parallax"
                android:fitsSystemWindows="true"/>
            <android.support.v7.widget.Toolbar
                android:id="@ id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"/>
        </android.support.design.widget.CollapsingToolbarLayout>
    </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">

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

            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="15dp"
                android:layout_marginLeft="15dp"
                android:layout_marginRight="15dp"
                android:layout_marginTop="35dp"
                app:cardCornerRadius="4dp">

            <TextView
                android:id="@ id/fruit_content_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="10dp" />

            </android.support.v7.widget.CardView>
        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>

    <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="16dp"
        android:src="@drawable/ic_comment"
        app:layout_anchor="@id/appBar"
        app:layout_anchorGravity="bottom|end"/>


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

演示一下:

对了,还有如何充分利用手机状态栏空间就像这张图片一样:

About

利用Material Support这个强大的库来实现卡片式布局、悬浮按钮和可交互性提示、滑动菜单和可折叠式标题栏,添加定位、登陆、电话、好友等功能

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages