调整图像大小以适合父布局高度和宽度

时间:2015-12-14 10:07:51

标签: android android-layout imageview scaletype

我希望根据Imageview的{​​{1}}和Height符合width而不会影响其比例。我使用的是RelativeLayout LinearLayout并添加了两个其他布局,即weightSumRelativeLayout 20和weightLinearLayout 80.我是将weight添加到imageview以占用RelativeLayout 20但是目前,我的图片占据其内容的宽度并且不遵循父级的宽度,因此导致推动其他布局。

我的布局如下:

layout.xml

weight

CenterFitImageView.cs

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/order_detail_container"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_marginLeft="4dp"
    android:layout_marginRight="8dp"
    android:layout_marginTop="16dp"
    android:clickable="true"
    android:foreground="?android:attr/selectableItemBackground"
    card_view:cardCornerRadius="2dp"
    card_view:cardElevation="1dp">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:weightSum="100"
        android:orientation="horizontal">
        <RelativeLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="20">
            <Droid.CenterFitImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_alignParentTop="true"
                android:layout_centerHorizontal="true"
                android:adjustViewBounds="true"
                android:id="@+id/imgArticleThumb"
                android:src="@drawable/Icon" />
        </RelativeLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="80"
            android:padding="5dp"
            android:orientation="vertical">
            <Droid.CustomTextView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:id="@+id/txtCategory"
                card_view:customFont="Fonts/Roboto-Bold.ttf"
                android:textColor="@color/CatTitle"
                android:textSize="12sp"
                android:text="Category" />
            <Droid.CustomTextView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:id="@+id/txtTitle"
                   android:ellipsize="end"
                android:singleLine="true"
                card_view:customFont="Fonts/Roboto-Bold.ttf"
                android:textColor="#000000"
                android:textSize="16sp"
                android:text="Title" />

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

预期产出:

enter image description here

我的输出:

enter image description here

4 个答案:

答案 0 :(得分:1)

您的根LinaerLayout上的

layout_width =“wrap_content” 是您出错的地方。如果您需要根据权重正确对齐您的观点,则必须使用 match_parent

请记住,如果您使用的是layout_weights和weightSum,则必须根据布置给出根布局和特定宽度或高度。 wrap_content ,表示根据孩子的大小显示您的布局。

结果代码将是

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:weightSum="100"
    android:orientation="horizontal">
    ....
    ....
</LinearLayout>

这是我得到的输出 layout_weight aligning views

ImageView的第一个RelativeLayout占20,而TextView的另一个占用80.

答案 1 :(得分:0)

对ImageView使用android:layout_height =“wrap_content”而不是match_parent,并设置textview高度和宽度wrap_content。

答案 2 :(得分:0)

首先,为什么你没有使用Linearlayout而不是RelativeLayout。当您使用所有LinearLayout时。

我会这样做。

    <?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/order_detail_container"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_marginLeft="4dp"
    android:layout_marginRight="8dp"
    android:layout_marginTop="16dp"
    android:clickable="true"
    android:foreground="?android:attr/selectableItemBackground"
    card_view:cardCornerRadius="2dp"
    card_view:cardElevation="1dp">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="100"
        android:orientation="horizontal">
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="40"
            android:gravity="center">
            <Droid.CenterFitImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
                android:adjustViewBounds="true"
                android:scaleType="centerCrop"
                android:id="@+id/imgArticleThumb"
                android:src="@drawable/Icon" />
        </LinearLayout>
        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="60"
            android:orientation="vertical"
            android:layout_marginLeft="5dp">
            <Droid.CustomTextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/txtCategory"
                card_view:customFont="Fonts/Roboto-Bold.ttf"
                android:textColor="@color/CatTitle"
                android:textSize="12sp"
                android:text="Category" />
            <Droid.CustomTextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/txtTitle"
                android:ellipsize="end"
                android:singleLine="true"
                card_view:customFont="Fonts/Roboto-Bold.ttf"
                android:textColor="#000000"
                android:textSize="16sp"
                android:text="Title" />

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

答案 3 :(得分:-1)

用maxwidth替换图像的layout_width="0"