Question

我想知道如何在google教程中实现Card View布局，在教程中只有简单的卡片视图，但如何获得这样的结果？ https://developer.android.com/design/material/images/card_travel.png

我可以实现这一点，但我需要有效地执行此操作，以便不增加视图层次结构，从而使渲染变长。

请举例说明如何实现这种观点。

Answer 1

enter image description here

只需在依赖项中添加：

    compile 'com.android.support:cardview-v7:21.+'

在布局中使用它的示例：

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    card_view:cardCornerRadius="1dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        tools:context="com.eugene.fithealth.TestingForSO">


        <ImageView
            android:id="@+id/image"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:orientation="vertical"
            android:scaleType="centerCrop"
            android:src="@drawable/drawer_image"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_above="@+id/description"
            android:background="#50000000"
            android:gravity="center_vertical"
            android:paddingLeft="16dp"
            android:text="Hello World!"
            android:textColor="#fff"
            android:textSize="22dp"/>


        <TextView
            android:id="@+id/description"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/image"
            android:layout_marginBottom="8dp"
            android:paddingLeft="16dp"
            android:paddingTop="16dp"
            android:text="Random Text Blah Blah Blah"
            android:textSize="16dp"/>

        <Button
            android:id="@+id/btnOne"
            style="?android:buttonBarButtonStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/description"
            android:layout_marginBottom="4dp"
            android:layout_marginLeft="4dp"
            android:text="Button One"
            android:textColor="#000"/>

        <Button
            android:id="@+id/btnTwo"
            style="?android:buttonBarButtonStyle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@+id/description"
            android:layout_toRightOf="@id/btnOne"
            android:text="Button Two"
            android:textColor="#03A9F4"/>

    </RelativeLayout>
</android.support.v7.widget.CardView>

Answer 2

试试这个cardlib库。我一直在使用它，它太棒了！

如何实施Google Like Card View

2 个答案: