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); } } } }
这样就可以非常方便的使用上下收缩的动画了。