CardView学习笔记
2017-04-02 本文已影响76人
NickelFox
一. 什么是CardView？
1.1官方介绍
CardView扩展 FrameLayout类并让您能够显示卡片内的信息，这些信息在整个平台中拥有一致的呈现方式。CardView小部件可拥有阴影和圆角。
1.2效果图
CardView里面嵌套TextView
二.用法
2.1使用步骤
- 在build.gradle中加入
dependencies {
compile 'com.android.support:cardview-v7:version'
}（version为版本号）
- xml中使用布局
- 注意：因为CardView继承自FrameLayout，因此其子控件一般只有一个或者是<ViewGroup>
<android.support.v7.widget.CardView
android:id="@+id/hello_world_card"
android:layout_width="match_parent"
android:layout_height="200dp"
app:cardCornerRadius="3dp"
app:cardElevation="@dimen/cardview_default_elevation"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Hello World!"
android:gravity="center"
android:textSize="24sp"/>
</android.support.v7.widget.CardView>
- 添加点击事件
mCardView = (CardView) findViewById(R.id.hello_world_card);
mCardView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"你点击了CardView",Toast.LENGTH_SHORT).show();
}
});
三.xml属性详细介绍 官方链接
- 注意：其中android.support.v7.cardview在xml中就是app（自定义布局的前缀）
android.support.v7.cardview:cardBackgroundColor
CardView的背景颜色.值为rgb或者argb颜色值（如#ffffff）
android.support.v7.cardview:cardCornerRadius
CardView的圆角弧度.值为dimension值（如4dp）
android.support.v7.cardview:cardElevation
CardView的阴影高度。值为dimension值（如4dp）
android.support.v7.cardview:cardMaxElevation
CardView的最大阴影高度。值为dimension值（如4dp），自己没看出来有什么效果
android.support.v7.cardview:contentPadding
Cardview内子控件与CardView边缘的边距。值为dimension值（如4dp）
android.support.v7.cardview:cardUseCompatPadding
在xml文件中设置内边距，V21+的版本和之前的版本仍旧具有一样的计算方式
android.support.v7.cardview:cardPreventConrerOverlap
在xml文件中设置内边距，在V20和之前的版本中添加内边距，这个属性为了防止内容和边角的重叠
四.源码
- MainActivity
public class MainActivity extends AppCompatActivity {
private CardView mCardView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mCardView = (CardView) findViewById(R.id.hello_world_card);
mCardView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this,"你点击了CardView",Toast.LENGTH_SHORT).show();
}
});
}
}
- XML
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="cn.foxnickel.recyclerview.MainActivity"
android:padding="8dp">
<android.support.v7.widget.CardView
android:id="@+id/hello_world_card"
android:layout_width="match_parent"
android:layout_height="200dp"
app:cardCornerRadius="3dp"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardElevation="4dp">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Hello World!"
android:gravity="center"
android:textSize="24sp"/>
</android.support.v7.widget.CardView>
</RelativeLayout>
