Android在布局中将文本放在图像上

时间:2014-05-12 09:12:23

标签: android layout text

很抱歉,如果之前有人问过这个问题,我会在Android中找到新手。我试图在Android上实现一个小应用程序并坚持布局问题。我必须并排放置4张图像,并将文字放在白色框的中间,如图所示。

enter image description here

有人可以帮助我如何将这样的图像放在布局和每个图像的文本上。任何建议都非常感谢!!!  我尝试了一些代码,但仍不确定我应该对图像,图像大小做什么?,缩放问题?,使用TableLayout?

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

<ScrollView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ffffff"
        android:shrinkColumns="*"
        android:stretchColumns="*" >

        <!-- Row 1 with single column -->

        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal" >

            <TextView
                android:id="@+id/recipe_description"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_span="4"
                android:padding="10dip"
                android:paddingBottom="30dip" />
        </TableRow>

        <!-- Row 2 with 3 columns -->

        <TableRow
            android:id="@+id/tableRow1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" >

            <TextView
                android:id="@+id/cal"
                android:layout_weight="1"
                android:background="@drawable/fat1"
                android:gravity="center"
                android:padding="20dip"
                android:text="text1"
                android:textColor="#000000" />

            <TextView
                android:id="@+id/fat"
                android:layout_weight="1"
                android:background="@drawable/fat2"
                android:gravity="center"
                android:padding="20dip"
                android:text="text2"
                android:textColor="#000000" />

            <TextView
                android:id="@+id/carbon"
                android:layout_weight="1"
                android:background="@drawable/fat3"
                android:gravity="center"
                android:padding="20dip"
                android:text="text3"
                android:textColor="#000000" />

            <TextView
                android:id="@+id/protein"
                android:layout_weight="1"
                android:background="@drawable/fat4"
                android:gravity="center"
                android:padding="18dip"
                android:text="text4"
                android:textColor="#000000" />
        </TableRow>
    </TableLayout>
</ScrollView>

1 个答案:

答案 0 :(得分:0)

   <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#493F0B"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/tv1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/ic_launcher"
            android:gravity="center_horizontal"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:paddingBottom="10dp"
            android:paddingTop="40dp"
            android:text="text1" />

        <TextView
            android:id="@+id/tv2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/ic_launcher"
            android:paddingLeft="10dp"
            android:paddingBottom="10dp"
            android:paddingRight="10dp"
            android:paddingTop="40dp"
            android:text="text2" />

        <TextView
            android:id="@+id/tv3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/ic_launcher"
            android:gravity="center_horizontal"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:paddingBottom="10dp"
            android:paddingTop="40dp"
            android:text="text3" />

        <TextView
            android:id="@+id/tv4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/ic_launcher"
            android:paddingLeft="10dp"
            android:paddingRight="10dp"
            android:paddingBottom="10dp"
            android:paddingTop="40dp"
            android:text="text4" />
    </LinearLayout>

如果你想为所有textview提供相同的宽度,你必须改变像这样的java代码的宽度

DisplayMetrics metrics = context.getResources().getDisplayMetrics();
        int screenWidth = metrics.widthPixels;
int width = (int) (screenWidth / 4);

        tv1.setLayoutParams(new LinearLayout.LayoutParams(width,
                LinearLayout.LayoutParams.MATCH_PARENT));

        tv2.setLayoutParams(new LinearLayout.LayoutParams(width,
                LinearLayout.LayoutParams.MATCH_PARENT));
        tv3.setLayoutParams(new LinearLayout.LayoutParams(width,
                LinearLayout.LayoutParams.MATCH_PARENT));
        tv4.setLayoutParams(new LinearLayout.LayoutParams(width,
                LinearLayout.LayoutParams.MATCH_PARENT));