Android实现炫酷的视觉差效果
这次带来的是结合CoordinatorLayout、AppBarLayout、CollapsingToolbarLayout和FloatingActionButton打造炫酷的视觉差效果。

实现步骤
一:需要在主题文件中将Activity的标题栏去掉

二:编写Activity的布局文件
<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=".MainActivity"><android.support.design.widget.AppBarLayoutandroid:id="@+id/appbar"android:layout_width="match_parent"android:layout_height="wrap_content"><android.support.design.widget.CollapsingToolbarLayoutandroid:layout_width="match_parent"app:contentScrim="@color/colorPrimary"app:expandedTitleMarginStart="15dp"app:collapsedTitleTextAppearance="@style/ToolbarTextStyle" //设置收缩时的标题样式app:expandedTitleTextAppearance="@style/CollapseexpandedTextStyle" //设置展开时的标题样式app:layout_scrollFlags="scroll|exitUntilCollapsed" //这个属性使得CollapsingToolbarLayout在滑动的时候显示隐藏android:layout_height="wrap_content"><ImageViewandroid:layout_width="match_parent"android:src="@mipmap/bg"android:scaleType="fitXY"app:layout_collapseMode="parallax" //这个属性使得ImageView在CollapsingToolbarLayout展开的时候显示android:layout_height="200dp" /><android.support.v7.widget.Toolbarandroid:layout_width="match_parent"android:id="@+id/toolbar"app:layout_collapseMode="pin" //这个属性使得Toolbar在CollapsingToolbarLayout收缩的时候显示android:layout_height="50dp">android.support.v7.widget.Toolbar>android.support.design.widget.CollapsingToolbarLayout>android.support.design.widget.AppBarLayout><android.support.v7.widget.RecyclerViewandroid:layout_width="match_parent"android:id="@+id/recycle"app:layout_behavior="@string/appbar_scrolling_view_behavior" //这个属性是让控件在AppBarLayout下边android:layout_height="match_parent">android.support.v7.widget.RecyclerView><android.support.design.widget.FloatingActionButtonandroid:layout_width="wrap_content"android:src="@drawable/ic_logo"app:layout_anchor="@id/appbar" //这个属性是让FloatingActionButton以AppBarLayout为锚点,同时这也是使FloatingActionButton实现显示隐藏的关键app:layout_anchorGravity="bottom|end" //在AppBarLayout的右下方app:borderWidth="0dp"app:rippleColor="#E23B74"app:elevation="6dp"app:pressedTranslationZ="12dp"android:clickable="true"android:layout_marginRight="10dp"android:layout_height="wrap_content" />android.support.design.widget.CoordinatorLayout>
style/ToolbarTextStyle
和style/CollapseexpandedTextStyle
- #fff
- 23sp
- #fff
- 18sp
三:编写Activity代码
public class MainActivity extends AppCompatActivity {Toolbar toolbar;RecyclerView recyclerView;AppBarLayout appBarLayout;private BaseQuickAdapterbaseQuickAdapter; @Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);toolbar=findViewById(R.id.toolbar);appBarLayout=findViewById(R.id.appbar);toolbar.setTitle("我是标题");setSupportActionBar(toolbar);// 设置条目(可以省略)========================recyclerView=findViewById(R.id.recycle);recyclerView.setLayoutManager(new LinearLayoutManager(this));final ArrayListstrings = new ArrayList<>(); for(int x=0;x<10;x++){strings.add("我是条目"+x);}baseQuickAdapter = new BaseQuickAdapter(R.layout.item, strings) { @Overrideprotected void convert(BaseViewHolder helper, String item) {helper.setText(R.id.tv_title, item);}};baseQuickAdapter.openLoadAnimation(BaseQuickAdapter.SLIDEIN_LEFT);baseQuickAdapter.setOnItemChildClickListener(new BaseQuickAdapter.OnItemChildClickListener() {@Overridepublic void onItemChildClick(BaseQuickAdapter adapter, View view, int position) {}});recyclerView.setAdapter(baseQuickAdapter);// ==================================================appBarLayout.addOnOffsetChangedListener(new AppBarStateChangeListener() {@Overridepublic void onStateChanged(AppBarLayout appBarLayout, State state) {if( state == State.EXPANDED ) {//展开状态toolbar.setNavigationIcon(R.drawable.ic_backfour);}else if(state == State.COLLAPSED){//折叠状态toolbar.setNavigationIcon(R.drawable.ic_back);}else {//中间状态toolbar.setNavigationIcon(R.drawable.ic_back);}}});}private abstract static class AppBarStateChangeListener implements AppBarLayout.OnOffsetChangedListener {public enum State {EXPANDED,COLLAPSED,IDLE}private State mCurrentState = State.IDLE;@Overridepublic final void onOffsetChanged(AppBarLayout appBarLayout, int i) {if (i == 0) {if (mCurrentState != State.EXPANDED) {onStateChanged(appBarLayout, State.EXPANDED);}mCurrentState = State.EXPANDED;} else if (Math.abs(i) >= appBarLayout.getTotalScrollRange()) {if (mCurrentState != State.COLLAPSED) {onStateChanged(appBarLayout, State.COLLAPSED);}mCurrentState = State.COLLAPSED;} else {if (mCurrentState != State.IDLE) {onStateChanged(appBarLayout, State.IDLE);}mCurrentState = State.IDLE;}}public abstract void onStateChanged(AppBarLayout appBarLayout, State state);}}
评论
