堆栈内存溢出
  简体   繁体   English

如何在线性布局中将两个 CradView 高度设为 wrap_content

[英]How to make two CradView height as wrap_content in a linear layout

 原文  2021-11-11 14:53:52  3   1    android/ android-layout/ android-cardview/ android-wrap-content/ materialcardview

问题描述

Ok I explain it in detail so there should be no confusion好的，我详细解释一下，以免混淆

I have two MaterialCardView in a linear or relative layout (i don't care about the parent layout I only want the result) I want that both of the MaterialCardView should have wrap_content height我在线性或相对布局中有两个MaterialCardView （我不关心父布局我只想要结果）我希望两个 MaterialCardView 都应该有wrap_content高度

Right now The 1st MaterialCardView contains a FrameLayout that has two things an image view and a include layout that has buttons that are to be shown on the image现在第一个MaterialCardView包含一个FrameLayout ，它有两个东西，一个图像视图和一个include要在图像上显示的按钮的布局

and和

The 2nd MaterialCardView also contains a FrameLayout that has some textViews and an imageView (as a button with both height and width as wrap_content )第二个MaterialCardView还包含一个FrameLayout ，它有一些textViews和一个imageView （作为一个按钮，高度和宽度都为wrap_content ）

right now it looks like this现在看起来像这样

as you can see in the above screenshot, I have given weightSum and both the MaterialCardView has match_parent height, but now正如你在上面的截图中看到的，我给了weightSum并且MaterialCardView都有match_parent高度，但现在

I want that我要那个

the 1st and 2nd card view height should be wrap_content so it can adjust their height accordingly.第一个和第二个卡片视图高度应该是wrap_content以便它可以相应地调整它们的高度。 I have tried to just simply make it wrap_content but it doesn't work我试图只是简单地让它 wrap_content 但它不起作用

Note:笔记：

1: This layout is a part of a verticle recycler view 1：这个布局是verticle recycler view的一部分

2: The TextView Sort and Category above the imageView is not part of this layout 2：imageView上面的TextView Sort and Category不属于这个布局

3: If anyone wants more references for the code please tell me I will update the question 3：如果有人想要更多的代码参考，请告诉我我会更新问题

Code代码

Update // Removed the button layout xml code so the question dont get more confusing and long更新// 删除了按钮布局 xml 代码，因此问题不会变得更加混乱和冗长

Ok after implementing ContraintLayout as suggested in the comment now the 1st and 2nd cardview is working fine as they taking up the height as the content inside it has but it is a mess好的，在按照评论中的建议实施 ContraintLayout 之后，现在第一个和第二个 cardview 工作正常，因为它们占据了内部内容的高度，但它是一团糟

what I want probably to look like // this is the fixed height but can get the idea Link我想要的可能看起来像 // 这是固定的高度，但可以得到这个想法链接

After implementing ContraintLayout and wrap_content height it look like this实现 ContraintLayout 和 wrap_content 高度后，它看起来像这样

post_item_container_home.xml // this is the updated code with wrap_content and ContraintLayout post_item_container_home.xml // 这是带有 wrap_content 和 ContraintLayout 的更新代码

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="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_centerInParent="true"
    android:background="@color/black"
    android:orientation="vertical">

    <com.google.android.material.card.MaterialCardView
        android:id="@+id/Card_View"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="5dp"
        android:layout_marginEnd="5dp"
        android:elevation="6dp"
        app:cardBackgroundColor="@color/black"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome"
        tools:ignore="MissingConstraints">

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

            <com.google.android.material.imageview.ShapeableImageView
                android:id="@+id/imagePostHome"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                android:contentDescription="@string/todo"
                android:tag="centerCrop"
                app:shapeAppearanceOverlay="@style/RoundedCornerHome" />

            <include
                android:id="@+id/imagepost_buttons"
                layout="@layout/imagepost_buttons" />
        </FrameLayout>

    </com.google.android.material.card.MaterialCardView>

    <com.google.android.material.card.MaterialCardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="5dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="5dp"
        android:layout_marginBottom="10dp"
        android:elevation="6dp"
        app:cardBackgroundColor="@color/dark_grey"
        app:layout_constraintBottom_toBottomOf="@+id/Card_View"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome"
        tools:ignore="MissingConstraints">

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

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="top|right"
                android:layout_marginTop="5dp"
                android:layout_marginEnd="25dp"
                android:contentDescription="@string/todo"
                android:src="@drawable/ic_baseline_attach_money_24"
                tools:ignore="RtlHardcoded" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="5dp"
                android:fontFamily="@font/roboto"
                android:text="Ian Somerhalder"
                android:textColor="@color/white"
                android:textSize="20sp"
                android:textStyle="bold"
                tools:ignore="SmallSp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="left|center_vertical"
                android:layout_marginLeft="10dp"
                android:fontFamily="@font/roboto"
                android:text=".............."
                android:textColor="@color/white"
                android:textSize="17sp"
                tools:ignore="RtlHardcoded" />

        </FrameLayout>


    </com.google.android.material.card.MaterialCardView>


</androidx.constraintlayout.widget.ConstraintLayout>

OLD / Orignal旧 / 原版

post_item_container_home.xml post_item_container_home.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerInParent="true"
    android:background="@color/black"
    android:orientation="vertical"
    android:weightSum="5">

    <com.google.android.material.card.MaterialCardView
        android:id="@+id/Card_View"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginStart="5dp"
        android:layout_marginEnd="5dp"
        android:layout_weight="4"
        android:elevation="6dp"
        app:cardBackgroundColor="@color/black"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome">

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

            <com.google.android.material.imageview.ShapeableImageView
                android:id="@+id/imagePostHome"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                android:contentDescription="@string/todo"
                android:tag="centerCrop"
                app:shapeAppearanceOverlay="@style/RoundedCornerHome" />

            <include
                android:id="@+id/imagepost_buttons"
                layout="@layout/imagepost_buttons" />
        </FrameLayout>

    </com.google.android.material.card.MaterialCardView>

    <com.google.android.material.card.MaterialCardView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginStart="5dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="5dp"
        android:layout_marginBottom="10dp"
        android:layout_weight="1"
        android:elevation="6dp"
        app:cardBackgroundColor="@color/dark_grey"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome">

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

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="top|right"
                android:layout_marginTop="5dp"
                android:layout_marginEnd="25dp"
                android:contentDescription="@string/todo"
                android:src="@drawable/ic_baseline_attach_money_24"
                tools:ignore="RtlHardcoded" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="5dp"
                android:fontFamily="@font/roboto"
                android:text="Ian Somerhalder"
                android:textColor="@color/white"
                android:textSize="20sp"
                android:textStyle="bold"
                tools:ignore="SmallSp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="left|center_vertical"
                android:layout_marginLeft="10dp"
                android:fontFamily="@font/roboto"
                android:text=".............."
                android:textColor="@color/white"
                android:textSize="17sp"
                tools:ignore="RtlHardcoded" />

        </FrameLayout>


    </com.google.android.material.card.MaterialCardView>


</LinearLayout>

1 个解决方案

解决方案1
 0  2021-11-20 18:01:54

With ConstranitLayout , it would be easier to adjust the buttons layout on top of the image;使用ConstranitLayout ，可以更轻松地调整图像顶部的按钮布局； and adjust the constraints of both cards to wrap their content.并调整两张卡片的约束以包装它们的内容。

The app:layout_constraintBottom_toBottomOf="@+id/Card_View" should be changed to: app:layout_constraintBottom_toBottomOf="@+id/Card_View"应该改为：

  • either app:layout_constraintBottom_toBottomOf="parent"要么app:layout_constraintBottom_toBottomOf="parent"
  • or app:layout_constraintTop_toBottomOf="@id/Card_View"或app:layout_constraintTop_toBottomOf="@id/Card_View"

And optionally you can adjust a minimum height constraint with app:layout_constraintHeight_min="100dp" and maximum height constraint with app:layout_constraintHeight_min="200dp" .. adjust the sizing to your needs和可选可以调整以最小的高度约束app:layout_constraintHeight_min="100dp"和最大高度约束与app:layout_constraintHeight_min="200dp" ..调整大小，以您的需求

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="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_centerInParent="true"
    android:background="@color/black"
    android:orientation="vertical">

    <com.google.android.material.card.MaterialCardView
        android:id="@+id/Card_View"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="5dp"
        android:layout_marginEnd="5dp"
        android:elevation="6dp"
        app:cardBackgroundColor="@color/black"
        app:layout_constrainedHeight="true"
        app:layout_constraintBottom_toTopOf="@id/bottom_card"
        app:layout_constraintTop_toTopOf="parent"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome">

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

            <com.google.android.material.imageview.ShapeableImageView
                android:id="@+id/imagePostHome"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"
                android:contentDescription="@string/todo"
                android:tag="centerCrop"
                app:shapeAppearanceOverlay="@style/RoundedCornerHome" />

            <include
                android:id="@+id/imagepost_buttons"
                layout="@layout/imagepost_buttons" />
        </FrameLayout>

    </com.google.android.material.card.MaterialCardView>

    <com.google.android.material.card.MaterialCardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="5dp"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="5dp"
        android:layout_marginBottom="10dp"
        android:elevation="6dp"
        app:layout_constraintHeight_min="100dp
        app:layout_constraintHeight_max="200dp
        app:cardBackgroundColor="@color/dark_grey"
        app:layout_constraintBottom_toBottomOf="parent"
        app:shapeAppearanceOverlay="@style/RoundedCornerHome">

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

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="top|right"
                android:layout_marginTop="5dp"
                android:layout_marginEnd="25dp"
                android:contentDescription="@string/todo"
                android:src="@drawable/ic_baseline_attach_money_24"
                tools:ignore="RtlHardcoded" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="5dp"
                android:fontFamily="@font/roboto"
                android:text="Ian Somerhalder"
                android:textColor="@color/white"
                android:textSize="20sp"
                android:textStyle="bold"
                tools:ignore="SmallSp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="left|center_vertical"
                android:layout_marginLeft="10dp"
                android:fontFamily="@font/roboto"
                android:text=".............."
                android:textColor="@color/white"
                android:textSize="17sp"
                tools:ignore="RtlHardcoded" />

        </FrameLayout>


    </com.google.android.material.card.MaterialCardView>


</androidx.constraintlayout.widget.ConstraintLayout>

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 线性布局高度中的android 2列表视图wrap_content - android 2 list view in linear layout height wrap_content 如何使CollapsingToolbar具有“ wrap_content”高度？ - How to make CollapsingToolbar with “wrap_content” height? 线性布局内的button layout_height = wrap_content具有比wrap_content大得多的高度 - Button layout_height=wrap_content inside linear layout has height much bigger then wrap_content 在约束布局中使 RecyclerView 的高度为“wrap_content” - make RecyclerView's height to “wrap_content” in Constraint layout Dialog片段与wrap_content以全屏显示。 如何使其成为布局的高度而不是全屏？ - Dialog Fragment with wrap_content coming as a full screen. How to make it as a height of layout and not a full screen? 如果 TextView 有 1 或 2 行，如何使高度为 wrap_content？ - How to make TextView height to wrap_content if it has 1 or 2 lines? 如何使ViewPager的高度wrap_content - How to make ViewPager's height wrap_content 如何在Android中使高度超过wrap_content？ - How to make height more than wrap_content in Android? 空的linear_layout具有wrap_content故障 - Empty linear_layout with wrap_content glitch Android：如何将高度设置为 wrap_content？ - Android: how to animate height to wrap_content?
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM