问题
I want to develop List like this picture
I had used to RecylerView ItemDecorator for overlap. But it's overlapping without shadow. the screen & decorator code is below
public class OverlapDecoration extends RecyclerView.ItemDecoration {
private final static int vertOverlap = -50;
@Override
public void getItemOffsets (Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
outRect.set(0, 0, 0, vertOverlap);
}
}
card_layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:tag="cards main container">
<android.support.v7.widget.CardView
android:id="@+id/card_view"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardBackgroundColor="@color/color_white"
card_view:cardElevation="5dp"
card_view:cardUseCompatPadding="true">
<TextView
android:id="@+id/textViewName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="30dp"
android:layout_marginBottom="30dp"
android:text="Android Name"
android:textAppearance="?android:attr/textAppearanceLarge"/>
</android.support.v7.widget.CardView>
</LinearLayout>
回答1:
try this code
card_layout.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:tag="cards main container">
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="0dp"
android:clipToPadding="false"
android:elevation="0dp"
card_view:cardUseCompatPadding="false"
card_view:paddingEnd="0dp"
card_view:paddingStart="0dp">
<TextView
android:id="@+id/textViewName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="30dp"
android:layout_marginTop="30dp"
android:gravity="center"
android:text="Android Name"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="@+id/textView2"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_above="@id/textViewName"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:background="@drawable/card_shadow" />
</android.support.v7.widget.CardView>
</RelativeLayout>
for card shadow card_shadow
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:angle="90"
android:endColor="#77111111"
android:startColor="@android:color/transparent" />
</shape>
回答2:
This is example of your problem solution for static CardView
, here you every time decrease your card_view:cardElevation
by 2dp or 5dp. But if you done this with recyclerview and want to dynamic CardView
then you have to add elevation in your RecyclerView Adapter
dynamically. And its decrease with its position increase. Set card elevation holder.cardView.setCardElevation()
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:tag="cards main container">
<android.support.v7.widget.CardView
android:id="@+id/card_view"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardElevation="20dp"
card_view:cardUseCompatPadding="false">
<TextView
android:id="@+id/textViewName1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="30dp"
android:layout_marginBottom="30dp"
android:text="Android Name"
android:textAppearance="?android:attr/textAppearanceLarge"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="@+id/card_view2"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardElevation="18dp"
card_view:cardUseCompatPadding="false">
<TextView
android:id="@+id/textViewName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="30dp"
android:layout_marginBottom="30dp"
android:text="Android Name"
android:textAppearance="?android:attr/textAppearanceLarge"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="@+id/card_view3"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardUseCompatPadding="false">
<TextView
android:id="@+id/textViewName3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="30dp"
android:layout_marginBottom="30dp"
android:text="Android Name"
android:textAppearance="?android:attr/textAppearanceLarge"/>
</android.support.v7.widget.CardView>
</LinearLayout>
Hope it will help you. Thanks.
回答3:
Try this.
In RecyclerView Adapter- on OnBindViewHolder method add the following code:
CardView cardView = ((MyViewHolder) holder).cardView;
float elevation = cardView.getCardElevation();
float value = elevation-Float.parseFloat((position*0.5)+"");
cardView.setCardElevation(value);
See the output here:
Note: depend on your code modify the above code and use it in right place.
For reference here is my sample adaptor code.
public class CustomAdapter extends RecyclerView.Adapter {
public static final String Name = "Name";
public static final String Author = "Author";
public static final String Description = "Description";
private List<Book> dataSet;
private Context context;
public CustomAdapter(List<Book> data, Context context) {
this.dataSet = data;
this.context = context;
}
public class MyViewHolder extends RecyclerView.ViewHolder {
ImageView profile;
TextView name, author,description;
CardView cardView;
public MyViewHolder(View itemView) {
super(itemView);
profile = (ImageView) itemView.findViewById(R.id.profile_image);
name = (TextView) itemView.findViewById(R.id.name);
author = (TextView) itemView.findViewById(R.id.author);
description = (TextView) itemView.findViewById(R.id.description);
cardView = (CardView) itemView.findViewById(R.id.cardview);
}
}
@Override
public int getItemCount() {
return dataSet.size();
}
@Override
public int getItemViewType(int position) {
return position;
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
RecyclerView.ViewHolder vh;
View v = LayoutInflater.from(parent.getContext())
.inflate(R.layout.book_layout_sample, parent, false);
vh = new MyViewHolder(v);
return vh;
}
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
if (holder instanceof MyViewHolder) {
Book book = dataSet.get(position);
((MyViewHolder) holder).profile.setImageDrawable(getResources().getDrawable(R.drawable.blank_user,this.context.getTheme()));
((MyViewHolder) holder).name.setText(book.title);
((MyViewHolder) holder).author.setText(book.author);
((MyViewHolder) holder).description.setText(book.description);
CardView cardView = ((MyViewHolder) holder).cardView;
float ele = cardView.getCardElevation();
float val = ele-Float.parseFloat((position*0.5)+"");
cardView.setCardElevation(val);
if(position==0)
{
RecyclerView.LayoutParams params = (RecyclerView.LayoutParams)cardView.getLayoutParams();
params.setMargins(0,0,0,0);
cardView.setLayoutParams(params);
}
}
}
}
来源:https://stackoverflow.com/questions/40520128/recyclerview-overlapping-without-shadow