如何缩放Android TableLayout

Question

如何缩放Android TableLayout

rac*_*z16 6 java android android-layout android-tablelayout pinchzoom

我正在用Java制作Android的gomoku游戏.

我在活动的顶部创建了一个记分牌,Button在底部创建了一个新游戏.

在中心,我创建了100 ImageView秒(10行和10列)TableLayout.它在平板电脑上工作得很好,但在手机中 - 特别是在较小的手机中 - ImageView它们太小了,你无法完美地触摸你想要的东西.

我想实现缩放功能.它可以是多点触控变焦,或者ZoomControl Button,我唯一需要的就是工作.所以我想放大并缩小TableLayout,但记分牌和新游戏Button都没有做任何事情.

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tableLayout1"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="center_vertical" >

<TableRow
    android:id="@+id/tableRowE"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:paddingTop="5dip"
    android:paddingBottom="10dip"
    android:gravity="center" >

    <TextView
        android:id="@+id/twScoreboard"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/result"
        android:textSize="20sp"
        android:layout_span="10"
        android:gravity="center"
    />

</TableRow>

<TableRow
    android:id="@+id/tableRow0"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingRight="5dip"
    android:paddingLeft="5dip"
    android:gravity="center"  >

    <ImageView
        android:id="@+id/ImageView1"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView2"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView3"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView4"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView5"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView6"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView7"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView8"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView9"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageViewx"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView11"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView12"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView13"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView14"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView15"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView16"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView17"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView18"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView19"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView20"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView21"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView22"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView23"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView24"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView25"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView26"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView27"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView28"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView29"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView30"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView31"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView32"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView33"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView34"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView35"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView36"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView37"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView38"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView39"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView40"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView41"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView42"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView43"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView44"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView45"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView46"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView47"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView48"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView49"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView50"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView51"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView52"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView53"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView54"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView55"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView56"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView57"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView58"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView59"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView60"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow6"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView61"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView62"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView63"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView64"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView65"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView66"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView67"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView68"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView69"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView70"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow7"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView71"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView72"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView73"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView74"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView75"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView76"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView77"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView78"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView79"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView80"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow8"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView81"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView82"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView83"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView84"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView85"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView86"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView87"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView88"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView89"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView90"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow9"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:gravity="center" >

    <ImageView
        android:id="@+id/ImageView91"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView92"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView93"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView94"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView95"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView96"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView97"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView98"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView99"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

    <ImageView
        android:id="@+id/ImageView100"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:src="@drawable/empty"
        android:textSize="20sp" />

</TableRow>


<TableRow 
    android:id="@+id/tableRowU"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:paddingTop="20dip"
    android:gravity="center" >

    <Button
        android:id="@+id/ImageViewNewGame"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_span="10"
        android:onClick="NewGame"
        android:text="@string/newGame"
        android:textSize="20sp" />

</TableRow>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Ell*_*ock 0

我认为您可能想通过使用GridView而不是 TableLayout 来完全改变创建图像网格的方式。使用 GridView，您可以控制列的大小（通过调用gridView.setColumnWidth(int)），而且从长远来看，它会真正清理您的布局/使您的代码更易于管理。因此，当您的用户按下“缩放”按钮时，只需增加列宽，在每个网格项中添加 ImageView match_parent，Android 就会自动为您缩放图像。我认为它还会使点击事件/未来对样式的更改更容易处理，并使布局 xml 更易于管理（更少的代码行、更高的可移植性、更少的故障点）。有关 GridViews 的教程，只需查看 Google 的指南：

http://developer.android.com/guide/topics/ui/layout/gridview.html

对于具有超过一列/行或两个相同类型视图的内容，您实际上不应该使用 TableLayout 。

但是，尽管有上述情况，如果您真的非常喜欢 TableLayout，那么您还有一些选择。最简单的可能是将其放入 ScrollView 中，并使用各种方法来缩放 TableLayout。例如，您可以手动调整 TableLayout 的宽度和高度，或者在其上设置 ScaleGestureDetector。这样，您可以放大内容，并在内容变大时滚动。然而，出于多种原因，我认为 GridView 绝对是更好的选择。

归档时间：	12 年，6 月前
查看次数：	1721 次
最近记录：	12 年，2 月前