UI 代 android studio kotlin

Question

我在 android studio 和 kotlin 都是业余爱好者。我需要一些帮助来生成特定的 UI。

我已经尝试过使用嵌套相对布局和内部相对布局内的滚动视图的某些方法。但是当我开始编写适配器时，我无法继续，因为我没有看到适配器选项。所以，我正在寻找建议来做到这一点。只是为了澄清：我想在屏幕上有 4 个 Textview，就像 4 个象限，然后我应该能够向下滚动以使用一个按钮获得另一个 Text 视图。在图片中 "what does this mean?" 下面是一个可展开的文本视图，下面是一个按钮。

首先，我展示了 xml 内容。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?android:attr/divider"
android:outlineAmbientShadowColor="@color/colorPrimary"
tools:context=".ProgressFragment">

<!-- TODO: Update blank fragment layout -->
<RelativeLayout
    android:id="@+id/progress_relayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ScrollView
       android:layout_width="match_parent"
       android:layout_height="match_parent">
            <TextView
                android:id="@+id/qudrant1_progresstext1"
                android:layout_width="190dp"
                android:layout_height="280dp"
                android:gravity="center"
                android:text="TextView" />

            <TextView
                android:id="@+id/qudrant2_progresstext2"
                android:layout_width="190dp"
                android:layout_height="280dp"
                android:layout_marginTop="280dp"
                android:gravity="center"
                android:text="TextView" />

            <TextView
                android:id="@+id/qudrant3_progresstext3"
                android:layout_width="190dp"
                android:layout_height="280dp"
                android:layout_marginLeft="190dp"
                android:gravity="center"
                android:text="TextView" />

            <TextView
                android:id="@+id/qudrant4_progresstext4"
                android:layout_width="190dp"
                android:layout_height="280dp"
                android:layout_marginLeft="190dp"
                android:layout_marginTop="280dp"
                android:gravity="center"
                android:text="TextView" />
    </ScrollView>

</RelativeLayout>


</FrameLayout>

感谢任何帮助。

Answer 1

问题的解决方法如下。 xml 文件内容必须是。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?android:attr/divider"
tools:context=".ProgressFragment">

<!-- TODO: Update blank fragment layout -->
<ScrollView
    android:id="@+id/progress_scrollview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="?android:attr/divider">

    <RelativeLayout
        android:id="@+id/progress_parentrelayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

         <RelativeLayout
            android:id="@+id/progress_child1relayout"
            android:layout_width="190dp"
            android:layout_height="280dp">

            <TextView
                android:id="@+id/qudrant1_progresstext1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:layout_marginTop="90dp"
                android:layout_marginLeft="60sp"
                android:text="TextView" />
            <ProgressBar
                android:id="@+id/progress_progressbar1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="180dp"
                android:layout_marginLeft="70dp"
                style="?android:attr/progressBarStyleHorizontal" />
         </RelativeLayout>

        <RelativeLayout
            android:id="@+id/progress_child2relayout"
            android:layout_width="190dp"
            android:layout_height="280dp"
            android:layout_below="@+id/progress_child1relayout">
            <TextView
                android:id="@+id/qudrant2_progresstext2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="90dp"
                android:layout_marginLeft="60sp"
                android:gravity="center"
                android:text="TextView" />
            <ProgressBar
                android:id="@+id/progress_progressbar2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="120dp"
                android:layout_marginLeft="70dp"
                style="?android:attr/progressBarStyleHorizontal" />
            <TextView
                android:id="@+id/quadrant2_textview1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Textview"
                android:textSize="15dp"
                android:layout_marginTop="150dp"
                android:layout_marginLeft="65dp"/>
            <TextView
                android:id="@+id/quadrant2_textview2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Textview"
                android:textSize="15dp"
                android:layout_marginTop="180dp"
                android:layout_marginLeft="65dp"/>
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/progress_child3relayout"
            android:layout_width="190dp"
            android:layout_height="280dp"
            android:layout_toRightOf="@+id/progress_child1relayout">
            <TextView
                android:id="@+id/qudrant3_progresstext3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="90dp"
                android:layout_marginLeft="60sp"
                android:gravity="center"
                android:text="TextView" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/progress_child4relayout"
            android:layout_width="190dp"
            android:layout_height="280dp"
            android:layout_below="@id/progress_child3relayout"
            android:layout_toRightOf="@+id/progress_child2relayout">
            <TextView
                android:id="@+id/qudrant4_progresstext4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="60sp"
                android:layout_marginTop="90dp"
                android:gravity="center"
                android:text="TextView" />
            <ProgressBar
                android:id="@+id/progress_progressbar3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="120dp"
                android:layout_marginLeft="50sp"
                style="?android:attr/progressBarStyleLarge" />
        </RelativeLayout>
        <TextView
            android:id="@+id/whatdoesthis_mean"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="What does this mean?"
            android:textStyle="bold"
            android:textColor="#200"
            android:layout_centerHorizontal="true"
            android:clickable="true"
            android:layout_marginTop="580dp"
            android:gravity="center"
            android:textSize="15dp"/>
        <Button
            android:id="@+id/child_button"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="620dp"
            android:text="child name"/>
    </RelativeLayout>
   </ScrollView>
</FrameLayout>

这将生成问题中要求的视图。谢谢大家的建议和支持。

UI 代 android studio kotlin

UI generation with android studio kotlin

android

android-layout

android-scrollview

android-relativelayout