Android相对布局未按应有的方式显示元素

【问题标题】：Android Relative Layout not displaying elements as it shouldAndroid相对布局未按应有的方式显示元素
【发布时间】：2014-04-23 17:07:29
【问题描述】：

我正在学习 Android，并尝试制作一个相对简单的应用程序，它会下载 XML 并根据输入参数显示一些结果。 我正在使用 Android Studio 0.4.6 和拖放式 UI 设计器。 我的问题是，当我在模拟器中启动应用程序时，我的 UI 看起来与设计器中的不同。

这是它在设计器中的外观：

这就是它在模拟器中的实际外观：

这是 XML 代码：

<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity"
    android:background="#95ffa1"
    android:id="@+id/mainActLayout">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/location"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textStyle="bold"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:text="@string/minTemp"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold"
        android:layout_below="@+id/button1"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView2"
        android:layout_marginTop="19dp"
        android:text="@string/maxTemp"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView3"
        android:layout_below="@+id/textView3"
        android:layout_marginTop="32dp"
        android:text="@string/humidity"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView4"
        android:layout_below="@+id/textView4"
        android:layout_marginTop="21dp"
        android:text="@string/pressure"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView3"
        android:layout_toRightOf="@+id/textView3"
        android:ems="10"
        android:textStyle="bold"
        android:editable="false"
        android:enabled="false">

        <requestFocus />
    </EditText>

    <EditText
        android:id="@+id/editText3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/textView3"
        android:layout_alignBottom="@+id/textView3"
        android:layout_alignLeft="@+id/editText2"
        android:ems="10"
        android:editable="false"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/editText4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:layout_above="@+id/textView5"
        android:layout_toRightOf="@+id/textView3"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/editText5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:layout_alignBottom="@+id/textView5"
        android:layout_alignLeft="@+id/editText4"
        android:layout_alignStart="@+id/editText4"
        android:textStyle="bold" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="doSearchActivity"
        android:text="@string/search"
        android:layout_marginTop="50dp"
        android:textStyle="bold"
        android:background="@android:color/holo_orange_light"
        android:layout_below="@+id/textView1"
        android:layout_alignRight="@+id/editText2"
        android:layout_alignEnd="@+id/editText2" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Save To History"
        android:id="@+id/button"
        android:textStyle="bold"
        android:background="@android:color/holo_green_light"
        android:layout_alignTop="@+id/button2"
        android:layout_toLeftOf="@+id/editText6" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="View History"
        android:id="@+id/button2"
        android:textStyle="bold"
        android:background="@android:color/holo_green_light"
        android:layout_above="@+id/button3"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Clear History"
        android:id="@+id/button3"
        android:background="@android:color/holo_green_light"
        android:textStyle="bold"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/button"
        android:layout_toLeftOf="@+id/button2" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/editText"
        android:layout_below="@+id/editText5"
        android:layout_toRightOf="@+id/textView3"
        android:layout_alignRight="@+id/editText5"
        android:layout_alignEnd="@+id/editText5"
        android:textStyle="bold" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/editText6"
        android:layout_below="@+id/editText"
        android:layout_alignLeft="@+id/editText"
        android:layout_alignStart="@+id/editText"
        android:layout_alignRight="@+id/editText"
        android:layout_alignEnd="@+id/editText"
        android:textStyle="bold" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textView"
        android:layout_above="@+id/editText6"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:text="@string/wind"
        android:textStyle="bold" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/clouds"
        android:id="@+id/textView6"
        android:layout_alignBottom="@+id/editText6"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:textStyle="bold" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:inputType="date"
        android:ems="10"
        android:id="@+id/editText7"
        android:layout_above="@+id/textView2"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:textStyle="bold"
        android:editable="false" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/date"
        android:id="@+id/textView7"
        android:layout_above="@+id/editText7"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:textStyle="bold"
        android:editable="false"/>

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/editText1"
        android:layout_above="@+id/textView7"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_toRightOf="@+id/textView2"
        android:editable="true" />

</RelativeLayout>

你能帮帮我吗？

【问题讨论】：

  • 布局是正确的，它是你认为它应该工作的方式，而不是。您没有考虑屏幕尺寸的不同变化，只是期望它在不同设备上显示相同。如果您希望它在所有设备上看起来都一样，您应该根据当前设备的尺寸/密度使用不同的尺寸和边距变化。

标签： android android-layout android-studio android-relativelayout android-ui


【解决方案1】：

你需要使用 ScrollView。

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity"
    android:background="#95ffa1"
    android:id="@+id/mainActLayout">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/location"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textStyle="bold"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:text="@string/minTemp"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold"
        android:layout_below="@+id/button1"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView2"
        android:layout_marginTop="19dp"
        android:text="@string/maxTemp"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView3"
        android:layout_below="@+id/textView3"
        android:layout_marginTop="32dp"
        android:text="@string/humidity"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView4"
        android:layout_below="@+id/textView4"
        android:layout_marginTop="21dp"
        android:text="@string/pressure"
        android:textAppearance="?android:attr/textAppearanceSmall"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/textView3"
        android:layout_toRightOf="@+id/textView3"
        android:ems="10"
        android:textStyle="bold"
        android:editable="false"
        android:enabled="false">

        <requestFocus />
    </EditText>

    <EditText
        android:id="@+id/editText3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/textView3"
        android:layout_alignBottom="@+id/textView3"
        android:layout_alignLeft="@+id/editText2"
        android:ems="10"
        android:editable="false"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/editText4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:layout_above="@+id/textView5"
        android:layout_toRightOf="@+id/textView3"
        android:textStyle="bold" />

    <EditText
        android:id="@+id/editText5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:layout_alignBottom="@+id/textView5"
        android:layout_alignLeft="@+id/editText4"
        android:layout_alignStart="@+id/editText4"
        android:textStyle="bold" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="doSearchActivity"
        android:text="@string/search"
        android:layout_marginTop="50dp"
        android:textStyle="bold"
        android:background="@android:color/holo_orange_light"
        android:layout_below="@+id/textView1"
        android:layout_alignRight="@+id/editText2"
        android:layout_alignEnd="@+id/editText2" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Save To History"
        android:id="@+id/button"
        android:textStyle="bold"
        android:background="@android:color/holo_green_light"
        android:layout_alignTop="@+id/button2"
        android:layout_toLeftOf="@+id/editText6" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="View History"
        android:id="@+id/button2"
        android:textStyle="bold"
        android:background="@android:color/holo_green_light"
        android:layout_above="@+id/button3"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Clear History"
        android:id="@+id/button3"
        android:background="@android:color/holo_green_light"
        android:textStyle="bold"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/button"
        android:layout_toLeftOf="@+id/button2" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/editText"
        android:layout_below="@+id/editText5"
        android:layout_toRightOf="@+id/textView3"
        android:layout_alignRight="@+id/editText5"
        android:layout_alignEnd="@+id/editText5"
        android:textStyle="bold" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/editText6"
        android:layout_below="@+id/editText"
        android:layout_alignLeft="@+id/editText"
        android:layout_alignStart="@+id/editText"
        android:layout_alignRight="@+id/editText"
        android:layout_alignEnd="@+id/editText"
        android:textStyle="bold" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textView"
        android:layout_above="@+id/editText6"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:text="@string/wind"
        android:textStyle="bold" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/clouds"
        android:id="@+id/textView6"
        android:layout_alignBottom="@+id/editText6"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:textStyle="bold" />

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:inputType="date"
        android:ems="10"
        android:id="@+id/editText7"
        android:layout_above="@+id/textView2"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:textStyle="bold"
        android:editable="false" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/date"
        android:id="@+id/textView7"
        android:layout_above="@+id/editText7"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:textStyle="bold"
        android:editable="false"/>

    <EditText
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/editText1"
        android:layout_above="@+id/textView7"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_toRightOf="@+id/textView2"
        android:editable="true" />

</RelativeLayout>
</ScrollView>

【讨论】：

    【解决方案2】：

    我看到了不同的问题。

    首先，在底部你有一些元素在元素之上。您尝试使用 ScrollView 容器解决。（将所有代码放入 Scrollview）

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
</ScrollView>

    其次，我看到 textview、edittext 和 button 的比例大小是不同的。我建议阅读有关 weightSum 的信息，这是您拥有按钮的方式，并且所有元素在不同的屏幕尺寸下看起来都相同。

    http://developer.android.com/reference/android/widget/LinearLayout.html#attr_android:weightSum

    【讨论】：

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-05-25
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多
      热门标签
      Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode