【Android UI】CoordinatorLayout实现带图片可拉伸的Toolbar
2015-10-08 16:18
363 查看
国际惯例,先看效果
![](https://oscdn.geek-share.com/Uploads/Images/Content/201510/08/2ac2aa403588145c6ef6f931a68a2053)
步骤一:
在build.gradle中添加如下代码
步骤二:
布局文件
步骤三:
Activity代码
Adapter代码
步骤一:
在build.gradle中添加如下代码
dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile 'com.android.support:appcompat-v7:23.0.1' compile 'com.android.support:design:23.0.1' compile 'com.android.support:recyclerview-v7:+' }
步骤二:
布局文件
<?xml version="1.0" encoding="utf-8"?> <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" android:fitsSystemWindows="true" tools:context=".MainActivity"> <android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="172dp" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" app:contentScrim="?attr/colorPrimary" app:expandedTitleMarginEnd="64dp" app:expandedTitleMarginStart="48dp" app:layout_scrollFlags="scroll|exitUntilCollapsed"> <ImageView android:id="@+id/backdrop" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" android:scaleType="centerCrop" android:src="@drawable/cat" app:layout_collapseMode="parallax" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_scrollFlags="scroll|enterAlways" app:layout_collapseMode="pin" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v7.widget.RecyclerView android:id="@+id/my_recycler_view" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior"> </android.support.v7.widget.RecyclerView> </android.support.design.widget.CoordinatorLayout>
步骤三:
Activity代码
public class MainActivity extends AppCompatActivity { private RecyclerView mRecyclerView; private RecyclerView.Adapter mAdapter; private RecyclerView.LayoutManager mLayoutManager; private String[] myDataset = {"A", "B", "C", "D", "E", "F", "G", "H", "J", "K", "L", "M", "N", "O", "P", "Q", "R"}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); getSupportActionBar().setDisplayHomeAsUpEnabled(true); CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar); collapsingToolbar.setTitle("Title"); mRecyclerView = (RecyclerView) findViewById(R.id.my_recycler_view); // improve performance if you know that changes in content // do not change the size of the RecyclerView mRecyclerView.setHasFixedSize(true); // use a linear layout manager mLayoutManager = new LinearLayoutManager(this); mRecyclerView.setLayoutManager(mLayoutManager); // specify an adapter (see also next example) mAdapter = new MyAdapter(myDataset); mRecyclerView.setAdapter(mAdapter); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); } }
Adapter代码
public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> { private String[] mDataset; public static class ViewHolder extends RecyclerView.ViewHolder { public TextView name; public ViewHolder(View v) { super(v); name = (TextView)v.findViewById(R.id.name); } } public MyAdapter(String[] myDataset) { mDataset = myDataset; } @Override public MyAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View v = LayoutInflater.from(parent.getContext()) .inflate(R.layout.list_item, parent, false); // set the view's size, margins, paddings and layout parameters ViewHolder vh = new ViewHolder(v); return vh; } @Override public void onBindViewHolder(MyAdapter.ViewHolder holder, int position) { String nameStr = mDataset[position]; holder.name.setText(nameStr); } @Override public int getItemCount() { return mDataset.length; } }
相关文章推荐
- 自定义UINavigationBar,出现坐标下移,UINavitionBar半透明效果
- FreePascal及Guide下载地址
- 拼图小游戏"ST--拼图"开发篇之开始界面UI布局
- android 的build.gradle 的API手册
- 解决"the currently displayed page contains invalid values"
- Excel导入异常Cannot get a text value from a numeric cell解决
- Unix Socket - Quick Guide
- POJ 2524 Ubiquitous Religions (并查集)
- UISearchBar 自定义UI
- UIStatusBar汇总_iOS9.0后修改状态栏颜色(UIStatusBar)
- 动态输入文字 uitextView的frame动态改变
- ASINetworkQueue 队列下载
- UI最佳实践的N条建议
- Android GUI之View事件处理(二)
- PHP报错: Can't use method return value in write context
- UEditor
- hbase definitive guide 笔记
- Android GUI之View事件处理
- iOS中的动画:核心动画Core Animation, UIView动画, Block动画, UIImageView的帧动画.
- MUI - H5实现ios长按图标后进入图标排序及删除功能的效果