CardView学习笔记

一. 什么是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>

五.参考

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容