CoordinatorLayout上下伸缩

  CoordinatorLayout是一个非常好的动画,可以实现Layout的上下收缩,完成非常好的一个过渡

1.build.gradle的配置

	compile 'com.android.support:design:26.0.0-alpha1'
	
    2 Xml文件的设置:
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_app_bar"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
   >

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

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


        <!--由于CollapsingToolbarLayout 的 特点,应用的标题文字在收缩和展开状态是会自动过渡的。如果你想要在展开状态改变标题文字的位置,
            你可以这样做:通过应用的 margin 4个属性,
            就是:app:expandedTitleMargin, app:expandedTitleMarginBottom, app:expandedTitleMarginEnd 以及 app:expandedTitleMarginStart
            或者如果你想要在折叠和展开状态时改变文本的显示。你可以这样来简单的实现:
            设置 TextAppearance,分别通过 app:collapsedTitleTextAppearance  app:expandedTitleTextAppearance 来设置。-->
        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"

            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleTextAppearance="@style/textToolbarTitle"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
            <!-- contentScrim 这个属性是设置折叠后Toolbar的颜色-->

            <!--RelativeLayout 是展示开的时候显示的内容-->
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fitsSystemWindows="true"
                app:layout_collapseMode="parallax"
                >
                <com.facebook.drawee.view.SimpleDraweeView
                    android:id="@+id/imager"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:scaleType="centerCrop"
                    android:src="?attr/colorPrimary"
                    app:layout_collapseMode="parallax"
                    app:layout_collapseParallaxMultiplier="0.7"
                    app:layout_scrollFlags="scroll|enterAlwaysCollapsed"/>


                <TextView
                    android:id="@+id/text_data"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:layout_centerHorizontal="true"
                    android:layout_marginBottom="108dp"
                    android:layout_marginRight="8dp"
                    android:textColor="#ffffff"
                    android:textSize="22sp"/>
            </RelativeLayout>
            <!--Toolbar 收缩时要写的内容-->
            <android.support.v7.widget.Toolbar
                android:id="@+id/weather_tb"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>
    <com.jcodecraeer.xrecyclerview.XRecyclerView

        android:id="@+id/weather_xrv"
        android:layout_width="match_parent"

        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        android:layout_height="match_parent">
        <!--behavior这是关联滑动上下展示的-->


    </com.jcodecraeer.xrecyclerview.XRecyclerView>

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

</android.support.v4.widget.DrawerLayout>

	一次使用,可以直接粘贴,然后修改成自己想要的布局即可
 
	3.java的内容:
public class AppBarActivity extends AppCompatActivity {

    private SimpleDraweeView simpleDraweeView;
    private TextView textView;
    private Toolbar toolbar;
    private XRecyclerView recyclerView;
    private List<String>list=new ArrayList<>();
    private MyAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_app_bar);
        getSupportActionBar().hide();
        simpleDraweeView=(SimpleDraweeView)findViewById(R.id.imager);
        textView=(TextView)findViewById(R.id.text_data);
        toolbar=(Toolbar)findViewById(R.id.weather_tb);
        recyclerView=(XRecyclerView)findViewById(R.id.weather_xrv);

        textView.setText("  ");
        //设置图片
        String Imageurl="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1504006880409&di=eb56fe190958a1da27d168d86a91698a&imgtype=0&src=http%3A%2F%2Fv1.qzone.cc%2Fpic%2F201406%2F13%2F11%2F40%2F539a72c27f7fc462.jpg%2521600x600.jpg";
        simpleDraweeView.setImageURI(Uri.parse(Imageurl));
        //收缩时在toolbar展示的文字
         toolbar.setTitle("关闭");

        //下面都是XRecyclerView的适配数据,没什么关系
        LinearLayoutManager layoutManager= new LinearLayoutManager(AppBarActivity.this);
        layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
        recyclerView.setLayoutManager(layoutManager);


        for (int i=0;i<40;i++){

            list.add("数据"+i+"~~~~~");

        }


        if (adapter==null){
            adapter=new MyAdapter(AppBarActivity.this,list);
            recyclerView.setAdapter(adapter);
        }else {
            adapter.notifyDataSetChanged();
        }



    }
    private class MyAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder>{
        private Context context;
        private List<String>list;

        public MyAdapter(Context context, List<String> list) {
            this.context = context;
            this.list = list;
        }

        @Override
        public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
          View view=LayoutInflater.from(context).inflate(R.layout.xrecyc_adapter,parent,false);
            HoldView holdView=new HoldView(view);
            return holdView;
        }

        @Override
        public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
            ((HoldView)holder).textView.setText(list.get(position));
        }

        @Override
        public int getItemCount() {
            return list.size();
        }

        public class HoldView extends RecyclerView.ViewHolder{
            private TextView textView;
            public HoldView(View itemView) {
                super(itemView);
                textView=(TextView)itemView.findViewById(R.id.xrecyc_text);

            }
        }
    }
}
	这样就可以非常方便的使用上下收缩的动画了。
 
	

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值