In the below example I have created Collapsing Toolbar function. Here I have created CoordinatorLayout and created all layout in CoordinatorLayout. Now I have added AppBarLayout, CollapsingToolbarLayout, ImageView, Toolbar, RecyclerView and FloatingActionButton. Now I have created CardView.xml layout here I have added CardView. Next step I have created CardAdapter class for using recyclerview & cardview. In cardAdapter I have also used Toast function to get item Position. In next step I have created Collepse class for set recycler view item name and id. In MainActivity I have used setOnClickListener for floatingActionButton. You can see below program it will clearly describe How to create CollapsingToolbar function.
Step(1)-main_activity.xml layout-
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
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"
pp:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="@+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="@drawable/nature"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
android:title="Collapsing Toolbar"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
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.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:clickable="true"
android:src="@drawable/ic_edit"
app:layout_anchor="@id/recyclerView"
app:layout_anchorGravity="bottom|right|end" />
</android.support.design.widget.CoordinatorLayout>
Step(2)-Created card_view.xml layout-
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
card_view:cardPreventCornerOverlap="false"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
card_view:cardCornerRadius="2dp"
card_view:contentPadding="10dp">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="@+id/rel">
<ImageView
android:id="@+id/cardimage"
android:layout_width="50dp"
android:layout_height="50dp"
android:scaleType="fitCenter"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="title"
android:layout_marginLeft="10dp"
android:textStyle="bold"
android:textSize="20sp"
android:id="@+id/cardtitle"
android:layout_gravity="center_vertical"/>
</LinearLayout>
</android.support.v7.widget.CardView>
Step(3)- Adding Support Library in build.graddle file-
compile 'com.android.support:cardview-v7:21.0.+'
compile 'com.android.support:recyclerview-v7:22.2.0'
Step(4)- Created Collepse class-
public class Collepse {
String name;
int id;
public Collepse(String name, int id) {
this.name = name;
this.id = id;
}
public String getName(){
return name;
}
public void setName(String name) {
this.name = name;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
}
Step(5)-Created CardAdapter class-
public class CardAdapter extends RecyclerView.Adapter<CardAdapter.ViewHolder> {
ImageView imageView;
LinearLayout rel;
List<Collepse> list = new ArrayList<>();
public CardAdapter(List<Collepse> list) {
this.list = list;
}
@Override
public int getItemCount() {
return list.size();
}
public Collepse getItem(int i) {
return list.get(i);
}
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext())
.inflate(R.layout.card_view, parent, false);
return new ViewHolder(itemView);
}
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.Collepse=getItem(position);
holder.cardtitle.setText(list.get(position).name);
holder.cardimage.setImageResource(list.get(position).id);
}
@Override
public void onAttachedToRecyclerView(RecyclerView recyclerView) {
super.onAttachedToRecyclerView(recyclerView);
}
public class ViewHolder extends RecyclerView.ViewHolder {
ImageView cardimage;
TextView cardtitle;
Collepse Collepse;
ImageView image;
LinearLayout rel;
CollapsingToolbarLayout collapsing_toolbar;
public ViewHolder(final View itemView) {
super(itemView);
collapsing_toolbar =(CollapsingToolbarLayout)itemView.findViewById(R.id.collapsing_toolbar);
cardimage = (ImageView) itemView.findViewById(R.id.cardimage);
image=(ImageView)itemView.findViewById(R.id.image);
cardtitle = (TextView) itemView.findViewById(R.id.cardtitle);
rel=(LinearLayout)itemView.findViewById(R.id.rel);
rel.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v ) {
Toast.makeText(itemView.getContext(), "Position:" + Integer.toString(getPosition()), Toast.LENGTH_SHORT).show();
}
}); }
}
}
Step(6)-MainActivity
public class MainActivity extends AppCompatActivity {
//ui control
Toolbar toolbar;
CollapsingToolbarLayout collapsingToolbarLayout;
RecyclerView recyclerView;
FloatingActionButton floatingActionButton;
CardAdapter adapter;
List<Collepse> collepse;
CardView cardView;
ImageView image;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
collapsingToolbarLayout = (CollapsingToolbarLayout)
findViewById(R.id.collapsing_toolbar);
recyclerView=(RecyclerView)findViewById(R.id.recyclerView);
toolbar = (Toolbar) findViewById(R.id.toolbar);
floatingActionButton=(FloatingActionButton)findViewById(R.id.fab);
image = (ImageView)findViewById(R.id.image);
collapsingToolbarLayout.setTitle("Demo");
setSupportActionBar(toolbar);
//recyclerview
LinearLayoutManager llm = new LinearLayoutManager(this);
llm.setOrientation(LinearLayoutManager.VERTICAL);
recyclerView.setLayoutManager(llm);
recyclerView.setHasFixedSize(true);
initializeData();
//set adapter
recyclerView.setAdapter(adapter);
floatingActionButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Snackbar.make(v, "You clicked on the fab", Snackbar.LENGTH_SHORT).show();
}
});
}
private void initializeData() {
collepse = new ArrayList<>();
collepse.add(new Collepse("London", R.drawable.three));
collepse.add(new Collepse("Japan 2", R.drawable.four));
collepse.add(new Collepse("India 3", R.drawable.five));
collepse.add(new Collepse("USA 4", R.drawable.six));
collepse.add(new Collepse("France 5", R.drawable.seven));
collepse.add(new Collepse("China 6", R.drawable.eight));
collepse.add(new Collepse("Dubai 7", R.drawable.nine));
collepse.add(new Collepse("Russia 8", R.drawable.ten));
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
0 Comment(s)