如何创建一个需要4/5到屏幕宽度android的布局

Question

我正在实施一个水平回收视图，趋势类别的视图类似于此图像

但是我通过修正宽度来实现这一目标。对于小屏幕cardview覆盖整个宽度，我不希望我的代码是...

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:orientation="vertical" android:layout_width="wrap_content"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
    android:layout_width="300dp"
    android:layout_height="150dp"
    card_view:cardCornerRadius="3dp"
    android:layout_marginLeft="5dp"
    android:layout_marginStart="5dp"
    android:layout_marginEnd="5dp"
    android:layout_marginRight="5dp"
    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:scaleType="fitXY"
            android:id="@+id/trendimage"
            android:src="@drawable/placeholder" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="4dp"
            android:id="@+id/trendtitle"
            android:layout_gravity="bottom"
            android:hint="Zakir Khan's Event"
            android:textSize="14sp"
            android:background="#88000000"
            android:textColor="@color/icons" />
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:src="@drawable/place_white_24dp"/>
    </FrameLayout>

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

Answer 1

您可以使用PercentRelativeLayout来实现这一目标。

第1步：
将百分比支持库添加到模块gradle文件中。

compile 'com.android.support:percent:23.0.0'

第2步：
在布局中添加百分比宽度：

示例：

<?xml version="1.0" encoding="utf-8"?>
    <android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical" 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <android.support.v7.widget.CardView
        app:layout_widthPercent="80%"
        android:layout_height="150dp"
        card_view:cardCornerRadius="3dp"
        android:layout_marginLeft="5dp"
        android:layout_marginStart="5dp"
        android:layout_marginEnd="5dp"
        android:layout_marginRight="5dp"
        card_view:cardElevation="1dp">

        <android.support.percent.PercentRelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@android:color/holo_red_dark">

            <ImageView
                android:id="@+id/trendimage"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="fitXY"
                android:src="@drawable/test"/>

            <TextView
                android:id="@+id/trendtitle"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:background="#88000000"
                android:hint="Test Event"
                android:padding="4dp"
                android:textSize="14sp"/>

            <ImageView
                app:layout_widthPercent="10%"
                app:layout_heightPercent="10%"
                android:layout_alignParentBottom="true"
                android:layout_alignParentRight="true"
                android:src="@drawable/test"/>

        </android.support.percent.PercentRelativeLayout>

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

我得到的结果：

我希望这会有所帮助

Answer 2

您可能需要计算屏幕的宽度，并将其中的4/5设置为适合您的onBindViewHolder调用。您可以在那里设置项目视图的布局参数（宽度）。