[Android] 如何使用RecylerView-搭配CardView

在古時候,使用了 cardslib 寫的程式,在2018年底Android Studio 說將不支援,所以要換一個新的寫法,改用 RecylerView + CardView。

先用Gradle 引用:

 implementation 'com.android.support:recyclerview-v7:27.1.1'
 implementation 'com.android.support:cardview-v7:27.1.1'

activity_main.xml

<?xml version=”1.0″ encoding=”utf-8″?>
<android.support.constraint.ConstraintLayout 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”
tools:context=”.MainActivity”>

<android.support.v7.widget.RecyclerView
android:id=”@+id/list_view”
android:layout_width=”match_parent”
android:layout_height=”match_parent” />

</android.support.constraint.ConstraintLayout>


MainActivity.java

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

ArrayList<String> myDataset = new ArrayList<>();
for(int i = 0; i < 100; i++){
myDataset.add(i + “”);
}
MyAdapter myAdapter = new MyAdapter(myDataset);
RecyclerView mList = (RecyclerView) findViewById(R.id.list_view);
final LinearLayoutManager layoutManager = new LinearLayoutManager(this);
layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
mList.setLayoutManager(layoutManager);
mList.setAdapter(myAdapter);
}

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.ViewHolder> {
private List<String> mData;

public class ViewHolder extends RecyclerView.ViewHolder {
public TextView mTextView;
public ViewHolder(View v) {
super(v);
mTextView = (TextView) v.findViewById(R.id.info_text);
}
}

public MyAdapter(List<String> data) {
mData = data;
}

@Override
public MyAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View v = LayoutInflater.from(parent.getContext())
.inflate(R.layout.item, parent, false);
ViewHolder vh = new ViewHolder(v);
return vh;
}

@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.mTextView.setText(mData.get(position));

}

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


item.xml

<?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”
android:layout_gravity=”center”
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
card_view:cardCornerRadius=”4dp”
android:layout_margin=”5dp”>

<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:orientation=”vertical”>

<ImageView
android:id=”@+id/img”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:src=”@mipmap/ic_launcher_round”
android:layout_margin=”5dp”
android:layout_gravity=”center”/>

<TextView
android:id=”@+id/info_text”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:textSize=”20sp”
android:layout_margin=”4dp”
android:gravity=”center”
/>
</LinearLayout>
</android.support.v7.widget.CardView>


CardView屬性介紹

  • app:cardBackgroundColor:設定卡片的背景色
  • app:cardCornerRadius:設定卡片圓角的大小
  • app:cardElevation:設置卡片陰影的大小
  • app:cardMaxElevation:設置卡片最大的陰影大小
  • app:cardPreventCornerOverlap:在API v20和之前的版本添加內邊距到CardView,以防止卡內容和圓角之間的交集。
  • app:cardUseCompatPadding:在API v21 +中添加內邊距與以前版本有相同的測量。
  • app:contentPadding:添加左、上、右、下的內邊距
  • app:contentPaddingBottom:添加下方的內邊距
  • app:contentPaddingLeft:添加左邊的內邊距
  • app:contentPaddingRight:添加右邊的內邊距
  • app:contentPaddingTop:添加上方的內邊距

波紋點擊效果

  1. android:clickable=”true”
  2. android:foreground=”?android:attr/selectableItemBackground”

執行畫面:

 

 

相關文章

寫留言

你的電子郵件位址並不會被公開。 必要欄位標記為 *