使用卡片视图进行设计？

Question

您可以在下图中看到，我必须在第一个卡片视图分区中放置一个图像视图中心。我知道如果卡片视图的大小固定，但在这种情况下，我应该根据屏幕将其包装起来尺寸。我还粘贴在下面。我尝试了很多方法，但图像在所有设备中都没有准确定位..

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="10dp">

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="2"
        card_view:cardCornerRadius="3dp"
        card_view:cardElevation="1dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="4">

                <ImageView
                    android:id="@+id/img_thumbnail"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:scaleType="centerCrop"
                    android:src="@drawable/ic_profile_thumb" />

            </RelativeLayout>

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1">

            </RelativeLayout>

        </LinearLayout>


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

    <View
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="0.1" />

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        card_view:cardCornerRadius="1dp"
        card_view:cardElevation="1dp">

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

</LinearLayout>

任何帮助将不胜感激..

供参考……

Answer 1

这种布局会产生想要的效果！ （您必须自己添加边距等）。

它使用CoordinatorLayout，您可以找到更多关于here的信息

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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="match_parent">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">


        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">


            <ImageView
                android:id="@+id/image"
                android:layout_width="match_parent"
                android:layout_height="192dp"

                />

            <View
                android:layout_width="match_parent"
                android:layout_height="56dp" />
        </LinearLayout>

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

    <android.support.v7.widget.CardView

        android:id="@+id/card"
        android:layout_width="match_parent"
        android:layout_height="192dp"/>

</LinearLayout>


<View
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:background="@android:color/black"
    android:layout_margin="16dp"
    app:layout_anchor="@+id/image"
    app:layout_anchorGravity="bottom|end"

    />



<android.support.design.widget.FloatingActionButton
    android:layout_width="48dp"
    android:layout_height="48dp"
    android:background="@android:color/black"
    android:layout_margin="16dp"
    app:layout_anchor="@+id/card"
    app:layout_anchorGravity="bottom|end"

    />

</android.support.design.widget.CoordinatorLayout>

Answer 2

这个怎么样...

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:padding="10dp">

        <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2"
            card_view:cardCornerRadius="3dp"
            card_view:cardElevation="1dp">

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <ImageView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_marginBottom="50dp"
                    android:scaleType="centerCrop"
                    android:src="@drawable/ic_profile_thumb" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="50dp"
                    android:layout_gravity="bottom"
                    android:background="@color/red_primary_color"></LinearLayout>

                <ImageView
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:layout_gravity="right|bottom"
                    android:layout_marginBottom="25dp"
                    android:layout_marginRight="20dp"
                    android:src="@drawable/abc_ic_menu_cut_mtrl_alpha" />


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


        <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_marginTop="10dp"
            android:layout_weight="1"
            card_view:cardCornerRadius="1dp"
            card_view:cardElevation="1dp">

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

    </LinearLayout>