如何使两个图像和一个textview在一个bar中具有相同的高度并填充整个宽度?

时间:2021-07-19 08:41:10

I'm trying to create a menu header with one image on the left, another on the right, and the title in the middle. The title is rather long so it needs to wrap the text.

我尝试创建一个菜单标题,左边一个图片,右边一个,中间是标题。标题很长,所以需要把文字包装起来。

I'm trying to get it so that the two images, which are of different sizes, scale to a small square and then have the text fill in the center space. I also want to use RelativeLayout and not TableLayout.

我试着让这两个不同大小的图像,缩放到一个小方块然后让文字填充到中心空间。我也想用相对的方法,而不是用表。

<RelativeLayout
    android:id="@+id/RelativeLayout02"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/ImageView_MenuHeader_Left"
        android:src="@drawable/iu"
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"
        android:maxWidth="@dimen/square_menus"  
        android:maxHeight="@dimen/square_menus"
        android:layout_alignBottom="@+id/ImageView_MenuHeader_Right"
        android:adjustViewBounds="true"
        android:scaleType="fitStart"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"  />
    <ImageView
        android:id="@+id/ImageView_MenuHeader_Right"
        android:src="@drawable/iu2"
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content" 
        android:scaleType="fitStart"
        android:adjustViewBounds="true"  
        android:maxHeight="@dimen/square_menus"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"  />
    <TextView
        android:id="@+id/HelpTitle"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:maxHeight="@dimen/square_menus"
        android:adjustViewBounds="true"
        android:text="@string/help_title"
        android:textSize="17sp"
        android:shadowColor="@android:color/white"
        android:shadowDx="0"
        android:shadowDy="0"
        android:shadowRadius="10"
        android:layout_alignParentTop="true"
        android:layout_alignBaseline="@id/ImageView_MenuHeader_Right"
        android:layout_toRightOf="@id/ImageView_MenuHeader_Left"
        android:layout_toLeftOf="@id/ImageView_MenuHeader_Right"
        android:textColor="@color/menu_title_color" />
    </RelativeLayout>

Right now what this code is producing is the right image doesn't look like a square, the width is larger than the height. The bottom of the left image is also higher than the textview, where I really want all of them to be the same height so all three look like a bar at the top.

现在这个代码产生的是正确的图像看起来不像正方形,宽度大于高度。左图的底部也比textview高,这里我希望所有的都是相同的高度,所以这三个看起来都像顶部的bar。

Any help would be greatly appreciated.

如有任何帮助,我们将不胜感激。

1 个解决方案

#1


0  

the right image doesn't look like a square, the width is larger than the height.

右边的图像看起来不像正方形,宽度大于高度。

add android:maxHeight="@dimen/square_menus" for the right ImageView

添加android:maxHeight="@dimen/square_menu ",用于正确的ImageView。

The bottom of the left image is also higher than the textview

左边图像的底部也比textview高。

add android:layout_alignBottom="@+id/ImageView_MenuHeader_Leftt" to the TextView

在TextView中添加android:layout_alignBottom="@+id/ImageView_MenuHeader_Leftt"

You might wanna consider changing the layout :-)

你可以考虑改变布局:-)

#1


0  

the right image doesn't look like a square, the width is larger than the height.

右边的图像看起来不像正方形,宽度大于高度。

add android:maxHeight="@dimen/square_menus" for the right ImageView

添加android:maxHeight="@dimen/square_menu ",用于正确的ImageView。

The bottom of the left image is also higher than the textview

左边图像的底部也比textview高。

add android:layout_alignBottom="@+id/ImageView_MenuHeader_Leftt" to the TextView

在TextView中添加android:layout_alignBottom="@+id/ImageView_MenuHeader_Leftt"

You might wanna consider changing the layout :-)

你可以考虑改变布局:-)