Question

我创建了一个表格，我想在其中显示9个动物和下一个箭头按钮。每行有3只动物，动物为3行，下一个箭头按钮为最后一行。我的问题是，在不同的屏幕尺寸上，行不会平均缩小，但只有最后一行的结果，下一个箭头按钮才会消失。

这是它在Nexus 4上的外观

这就是它看起来像一个3.2英寸大小的小屏幕

这是我的XML代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_animals"
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"
android:background="@color/background"
tools:context="kidsbook.jok.kidsbook.Animals">

<TableLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/ads_text"
    android:weightSum=".9"
    android:id="@+id/animalsPage1"
    android:visibility="visible">

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:weightSum=".9">

        <Button
            android:background="@drawable/cat"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/catSounds"
            android:layout_weight=".3"/>

        <Button
            android:background="@drawable/dog"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/dogSounds"
            android:layout_weight=".3"/>

        <Button
            android:background="@drawable/chicken"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/chickenSounds"
            android:layout_weight=".3"/>
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:weightSum=".9">

        <Button
            android:background="@drawable/horse"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/horseSounds"
            android:layout_weight=".3"/>

        <Button
            android:background="@drawable/frog"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/frogSounds"
            android:layout_weight=".3"/>

        <Button
            android:background="@drawable/pig"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/pigSounds"
            android:layout_weight=".3"/>
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:weightSum=".9">

        <Button
            android:background="@drawable/cock"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/cockSounds"
            android:layout_weight=".3"/>

        <Button
            android:background="@drawable/donkey"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/donkeySounds"
            android:layout_weight=".3"/>

        <Button
            android:background="@drawable/sheep"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:id="@+id/sheepSounds"
            android:layout_weight=".3"/>
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="end"
        android:weightSum="1">

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight=".22"
            android:id="@+id/nextButtonAnimalsTo2"
            android:background="@drawable/next_arrow"
            android:onClick="toPage2from1"/>
    </TableRow>

</TableLayout>

<TextView
    android:text="@string/ads"
    android:layout_gravity="center"
    android:layout_width="match_parent"
    android:minHeight="50dp"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:textSize="20sp"
    android:id="@+id/ads_text"
    android:layout_alignParentBottom="true"/>

</RelativeLayout>

任何建议和帮助都将受到高度赞赏，并提前感谢您。

Answer 1

@Smolikas，我认为您的视图在小屏幕上重叠，因为您使用的是RelativeLayout。您可以在scrollview内使用LinearLayout，其方向为vertical。它会对你有用。

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/scrollView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true">

    <LinearLayout
        android:id="@+id/activity_animals"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin">

你的TableLayout＆amp; TextView的。

    </LinearLayout>
</ScrollView>

Answer 2

尝试此布局：使用Linearlayout代替Relativelayout并正确管理布局权重和权重以划分屏幕。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_animals"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/color_white"
    android:orientation="vertical"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:weightSum="5">

    <TableLayout
        android:id="@+id/animalsPage1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_above="@+id/ads_text"
        android:layout_weight="4"
        android:visibility="visible"
        android:weightSum="4">

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:weightSum="3">

            <Button
                android:id="@+id/catSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />

            <Button
                android:id="@+id/dogSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />

            <Button
                android:id="@+id/chickenSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:weightSum="3">

            <Button
                android:id="@+id/horseSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />

            <Button
                android:id="@+id/frogSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />

            <Button
                android:id="@+id/pigSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:weightSum="3">

            <Button
                android:id="@+id/cockSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />

            <Button
                android:id="@+id/donkeySounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />

            <Button
                android:id="@+id/sheepSounds"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher" />
        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:gravity="end"
            android:weightSum="3">

            <Button
                android:id="@+id/nextButtonAnimalsTo2"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="@mipmap/ic_launcher"
                android:onClick="toPage2from1" />
        </TableRow>

    </TableLayout>

    <TextView
        android:id="@+id/ads_text"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_alignParentBottom="true"
        android:layout_gravity="center"
        android:layout_weight="1"
        android:gravity="center"
        android:text="Your TEXT"
        android:textColor="#000000"
        android:textSize="20sp" />

</LinearLayout>

输出：

TableLayout行不会同等缩小，但只有最后一行在不同的屏幕尺寸上

2 个答案: