关闭

Material Design 入门(二)——CardView

252人阅读 评论(0) 收藏 举报
分类:

上一章我们分享了TextInputLayout和TextInputEditText的使用方法,比较简单,下面我们再来分享一个小控件CardView的用法。

java.lang.Object
   ↳ android.view.View

   ↳ android.view.ViewGroup


   ↳ android.widget.FrameLayout



   ↳ android.support.v7.widget.CardView

CardView是Android 5.0中新出的一个控件,从上面的继承结构树中可以看出它的父类是FrameLayout,其实CardView就是在FrameLayout的基础上添加了圆角和阴影的效果。它通常被用在ListView和RecyclerView中,作为他们的itemView出现。


上面是CardView的一些常用的属性,比较容易理解,直接上代码。

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    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="wrap_content"
    android:layout_marginBottom="5dp"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="5dp"
    android:clickable="true"
    app:cardCornerRadius="10dp"
    app:cardElevation="10dp">

    <LinearLayout
        style="@style/CardView.Content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/ivBook"
            android:layout_width="109dp"
            android:layout_height="135dp"
            android:src="@mipmap/ic_launcher"
            android:transitionName="书籍"/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:orientation="vertical">

            <TextView
                android:id="@+id/tvTitle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textAppearance="@style/TextAppearance.AppCompat.Title"
                android:textColor="@android:color/darker_gray"/>

            <TextView
                android:id="@+id/tvDesc"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="2dp"
                android:text="描述"
                android:textColor="@android:color/darker_gray"/>
        </LinearLayout>

    </LinearLayout>

</android.support.v7.widget.CardView>
效果如图:


效果还是不错的,也比较简单,大家可以动手试一下,以后再有圆角的需求就不用那么麻烦了呢。推荐大家看下这篇文章 http://www.jianshu.com/p/20ba212a5f0c

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:120869次
    • 积分:2799
    • 等级:
    • 排名:第12892名
    • 原创:154篇
    • 转载:65篇
    • 译文:0篇
    • 评论:13条
    博客专栏
    最新评论