1

我正在尝试创建一个屏幕(纵向模式),显示 4 个图像(大小相同,旨在缩小以适应屏幕),占据整个屏幕,将屏幕分成象限(一个高的 2x2 网格)。这将作为活动的主菜单类型,并且每个图像都应该是可点击的,以便将用户带到不同的活动。

我曾尝试在 LinerLayout 中使用 GridView(使用 Google 的 GridView 教程中的很多内容),但无法使图像正确缩放以填满整个屏幕。我在图像周围和/或整个屏幕的滚动中获得了额外的边距。

我也尝试过使用 TableLayout,在 2 行中的每一行中放置 2 个图像。从视觉上看,这非常有效。不幸的是,在使用它时,我似乎无法在我的活动代码中引用 TableLayout 中的 ImageView 项目(findViewById 始终返回 null)。

我觉得 TableLayout 真的不是“正确的做法”,但我想听听其他人怎么说。无论哪种方式,应该做些什么来完成我想要的功能?

谢谢。

编辑 1.1:相对布局更适合排列整齐。现在我只剩下 findViewById 总是返回 null 的问题了。到目前为止,这是我的代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:background="@color/homescreen_bgcolor"
        >
    <ImageView id="@+id/one"
               android:layout_alignParentTop="true"
               android:layout_alignParentLeft="true"
               android:src="@drawable/item1"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"/>
    <ImageView id="@+id/two"
               android:layout_alignParentTop="true"
               android:layout_alignParentRight="true"
               android:src="@drawable/item2"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"/>
    <ImageView id="@+id/three"
               android:layout_alignParentBottom="true"
               android:layout_alignParentLeft="true"
               android:src="@drawable/item3"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"/>
    <ImageView id="@+id/four"
               android:layout_alignParentBottom="true"
               android:layout_alignParentRight="true"
               android:src="@drawable/item4"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"/>
    </RelativeLayout>

public class HomeScreenActivity2 extends Activity {
  @Override
  public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.homescreen2);

    ImageView imageView = (ImageView) findViewById(R.id.one);


    imageView.setClickable(true);
    imageView.setOnClickListener(new View.OnClickListener() {
      public void onClick(View view) {
        Log.i("Test", "test");
      }
    });
  }
}
4

2 回答 2

3

这是一个示例布局,展示了如何仅使用 RelativeLayout 来实现覆盖整个屏幕的 2 X 2 网格。

<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" >

<View
    android:id="@+id/centerVerticalShim"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_centerVertical="true"
    android:visibility="invisible" />

<View
    android:id="@+id/centerHorizontalShim"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_centerHorizontal="true"
    android:visibility="invisible" />

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/centerVerticalShim"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_toLeftOf="@+id/centerHorizontalShim"
    android:background="#42A5F5"
    android:gravity="center"
    android:text="@string/one"
    android:textColor="#FFFFFF" >
</TextView>

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/centerVerticalShim"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:layout_toRightOf="@+id/centerHorizontalShim"
    android:background="#EF5350"
    android:gravity="center"
    android:text="@string/two"
    android:textColor="#FFFFFF" >
</TextView>

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/centerVerticalShim"
    android:layout_toLeftOf="@+id/centerHorizontalShim"
    android:background="#66BB6A"
    android:gravity="center"
    android:text="@string/three"
    android:textColor="#FFFFFF" >
</TextView>

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/centerVerticalShim"
    android:layout_toRightOf="@+id/centerHorizontalShim"
    android:background="#5C6BC0"
    android:gravity="center"
    android:text="@string/four"
    android:textColor="#FFFFFF" >
</TextView></RelativeLayout>

上述布局导致:

于 2015-06-11T23:56:52.147 回答
0

我认为 TableLayout 可以为您工作,但我建议您也尝试一下RelativeLayout。您基本上可以使用以下组合将图像固定到四个象限

android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"`

在您的图像上。

我在我的应用程序中做类似的事情,我在主页上有多个按钮可以启动相应的活动。RelativeLayout 工作正常,它避免了嵌套的 Layout 对象,这会在渲染和布局过程中妨碍性能(如果它失控)。

于 2010-11-03T17:37:51.460 回答