[英]Placing an ImageView below a TextView
我有一个带有TextView
和ImageView
的RelativeLayout
,如下所示:
橙色是ImageView
的背景色,用于说明图像本身的开始与ImageView
的开始之间有多少空间。 如何使图像显示在ImageView
的顶部,以便标题直接位于图像上方,而中间没有橙色?
这是我的布局:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Recyclerview -->
<com.sometimestwo.moxie.MultiClickRecyclerView
android:id="@+id/recycler_zoomie_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- Container for title and image-->
<RelativeLayout
android:id="@+id/hover_view_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center|top"
android:visibility="gone">
<!-- Title -->
<TextView
android:id="@+id/hover_view_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorBgBlackTint"
android:gravity="center"
android:textColor="@color/colorWhite"
android:visibility="visible" />
<!-- Imageview that holds dog picture -->
<ImageView
android:id="@+id/hover_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/hover_view_title"
android:background="@color/colorDarkThemeAccent"
android:visibility="visible" />
</RelativeLayout>
</FrameLayout>
您可以通过以下方式使用RelativeLayout
实现:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="13dp"
android:text="TextView"
android:textSize="24sp"
android:textStyle="bold" />
<ImageView
android:id="@+id/imageView2"
android:layout_width="216dp"
android:layout_height="217dp"
android:layout_below="@+id/textView"
android:scaleType="fitStart"
android:adjustViewBounds="true"
android:layout_centerHorizontal="true"
android:background="@drawable/ic_launcher_background" />
</RelativeLayout>
这是我的结果的屏幕截图
同样,通过LinearLayout
以这种方式:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">
<TextView
android:layout_gravity="center"
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="13dp"
android:text="TextView"
android:textSize="24sp"
android:textStyle="bold" />
<ImageView
android:layout_gravity="center"
android:id="@+id/imageView2"
android:layout_width="216dp"
android:layout_height="217dp"
android:background="@drawable/ic_launcher_background" />
</LinearLayout>
这里有几个选项,我真的建议您使用ConstraintLayout,但这确实是另一个问题。 为了使您的布局按预期工作,我建议添加scaleType="fit_start"
。 这将缩放图像,使其适合您的ImageView并将其对齐到顶部/左侧(在rtl布局中为右侧)。 除非您在所有情况下都需要图像高,否则设置adjustViewBounds="true"
也很有可能也会起作用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.