Android Material风格的应用(五)--CollapsingToolbar

本文详细介绍了如何在Android应用中使用CollapsingToolbar组件实现美观的Material Design风格界面。通过具体的代码示例和布局文件配置,展示了如何创建一个包含图片背景、随滚动效果变化的标题栏以及与之协调的工具栏。
Collapsing Toolbar

Android Material风格的应用(一)--AppBar TabLayout
Android Material风格的应用(二)--RecyclerView
Android Material风格的应用(三)--DrawerLayout
Android Material风格的应用(四)--FloatActionButton
Android Material风格的应用(五)--CollapsingToolbar

CollapsingToolbar工程源码 我们为列表的item创建一个详情页面,创建DetailActivity.java对应的布局文件activity_detail.xml

<android.support.design.widget.AppBarLayout
  android:layout_width="match_parent"
  android:layout_height="@dimen/app_bar_height"
  android:fitsSystemWindows="true"
  android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

  <android.support.design.widget.CollapsingToolbarLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:id="@+id/collapsing_toolbar"
      android:fitsSystemWindows="true"
      android:theme="@style/ThemeOverlay.AppCompat.Dark"
      app:contentScrim="?attr/colorPrimary"
      app:expandedTitleMarginEnd="@dimen/article_keylines"
      app:expandedTitleMarginStart="@dimen/md_keylines"
      app:layout_scrollFlags="scroll|exitUntilCollapsed">
      <ImageView
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:id="@+id/image"
          android:fitsSystemWindows="true"
          android:scaleType="centerCrop"
          app:layout_collapseMode="parallax"/>
      <android.support.v7.widget.Toolbar
          android:layout_width="match_parent"
          android:layout_height="?attr/actionBarSize"
          app:layout_collapseMode="pin"
          app:popupTheme="@style/ThemeOverlay.AppCompat.Light"></android.support.v7.widget.Toolbar>
  </android.support.design.widget.CollapsingToolbarLayout>

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

在代码中初始化相关的逻辑

CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout)findViewById(R.id.collapsing_toolbar);

转载于:https://my.oschina.net/coderminer/blog/787635

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值