更改和android应用程序的用户界面

我正在制作一个视频应用程序，在屏幕上我想有一个图像回顾和播放按钮和一些描述文字。我想把图像的全宽和图像中间的播放按钮制作出来。然后文本应位于按钮和图像下方

下面是我目前通过下面的布局得到的

我的布局

 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/scrollView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="@color/black">


<RelativeLayout 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true" 
        android:background="@color/list_second_white"
        android:id="@+id/relative_header">

        <TextView
            android:id="@+id/text_category"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:padding="5dp"
            android:text=""
            android:textAppearance="?android:attr/textAppearanceMedium" />

         <TextView
            android:id="@+id/second"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:padding="5dp"
            android:text=""
            android:textAppearance="?android:attr/textAppearanceMedium" />

    </RelativeLayout>

    <ImageView
        android:id="@+id/picture"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/relative_header"
        android:layout_centerHorizontal="true"
        android:contentDescription="@string/desc"
        android:src="@drawable/ic_launcher" />

    <ImageView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/picture"
        android:layout_marginTop="60dp"
        android:layout_centerHorizontal="true"
        android:contentDescription="@string/desc"
        android:src="@drawable/video_thumb_small"
        />


    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/picture"
        android:layout_centerHorizontal="true"
        android:text=""
        android:textStyle="bold"
        android:textColor="@color/list_second_white"
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <TextView
        android:id="@+id/text_desc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/text"
        android:padding="10dp"
        android:textColor="@color/blue"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceMedium" />

</RelativeLayout>

 </ScrollView>

这就是我想要实现的目标

---

在第一张图像上，按钮没有完全重叠图像预览。

我解决问题的方法是

--ScrollView
  --LinearLayout 
    --RelativeLayout
      --TextView
      --TextView
    --FrameLayout
      --ImageView
      --ImageView
    --TextView
    --TextView

具有垂直方向的线性布局将在其中依次放置视图。注意：每个布局占用父布局的整个宽度

RelativeLayout，如您所知，用于相对于彼此或父视图放置子视图

FrameLayout可将一个视图置于另一个视图之上

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/scrollView1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/black">


<LinearLayout 
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/list_second_white"
    android:id="@+id/relative_header">

    <TextView
        android:id="@+id/text_category"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:padding="5dp"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceMedium" />

     <TextView
        android:id="@+id/second"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:padding="5dp"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceMedium" />

</RelativeLayout>

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

<ImageView
    android:id="@+id/picture"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleType="centerCrop"
    android:adjustViewBounds="true"
    android:contentDescription="@string/desc"
    android:src="@drawable/ic_launcher" />

<ImageView 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:layout_gravity="center"
    android:contentDescription="@string/desc"
    android:src="@drawable/video_thumb_small" />

</FrameLayout>


<TextView
    android:id="@+id/text"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text=""
    android:textStyle="bold"
    android:gravity="center"
    android:layout_gravity="center"
    android:textColor="@color/list_second_white"
    android:textAppearance="?android:attr/textAppearanceMedium" />

<TextView
    android:id="@+id/text_desc"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp"
    android:textColor="@color/blue"
    android:text=""
    android:textAppearance="?android:attr/textAppearanceMedium" />

</LinearLayout>

</ScrollView>

至

@+id/text

还加

    android:scaleType="centerCrop"
    android:adjustViewBounds="true"
    // will scale preview image 

至

@+id/picture

同样在

ImageView

中使用

android:src=“@drawable/video\u thumb\u small”

改变

    android:gravity="center"
    android:layout_gravity="center"
    // will center the play button 

---

这张图片是你想要的还是你当前布局中得到的？这张图片是我现在想要的图片（比如我制作了快速线框），我的防病毒软件不希望我访问第二个链接。你能在imgur.com上发布它吗？我会把图片添加到你的帖子中吗？是的，这里是谢谢：）我真的非常感谢你的帮助这是结果我试图让它变成这样你应该解释你改变了什么，为什么它应该为OP工作，而不是仅仅发布code@codeMagic好的，我会更新我的ans，给我几个mins@codeMagic我已经更新了我的ans。我希望它能帮助OP更多地了解它是如何工作的

    android:gravity="center"
    android:layout_gravity="center"
    // will center the play button