如何在图像和文本的左下方布局?

时间:2012-04-04 08:47:51

标签: android android-layout

我需要制作一个特定于网页的布局,它需要看起来像一个带有图像和文本的网页文章。看图像。

由于这在Web世界中很容易做到,我不确定如何在XML布局中执行此操作。

显然,TextView必须在图像存在时位于左侧,并且在到达图像底部后,它必须拉伸到屏幕宽度。我尝试了两个TextViews(一个用于左边,另一个用于底部),但由于文本字体大小,它看起来不正确。


修改

我还尝试动态捕捉图像的高度,然后将其分配给我的TextView,然后在这两个元素下制作另一个具有屏幕大小的TextView。这不起作用,因为我无法控制由于第一个TextView的高度有限而不可见的文本。

4 个答案:

答案 0 :(得分:1)

如果你还没有找到答案。这是正在回答的同类问题。

How to align TextView around an ImageView?

在你的情况下,你唯一需要改变的是,使对齐方式相反。

<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<TextView
    android:textSize="18.0sp"
    android:id="@+id/message_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/text" />
<ImageView 
    android:src="@drawable/icon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toRightOf="@+id/message_view"
    android:id="@+id/icon" />

从这里开始,

http://dev.androidteam.ru/snippets/textview/leadingmarginspan2

答案 1 :(得分:0)

看看这个。它和你想做的一样

<?xml version="1.0" encoding="utf-8"?>

android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<LinearLayout
    android:id="@+id/linearLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <LinearLayout
        android:id="@+id/linearLayout2"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#FFFFFF"
            android:text="TextView" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="fill_parent"
            android:layout_marginTop="5dp"
            android:background="#FFFFFF"
            android:layout_height="wrap_content"
            android:text="TextView" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="fill_parent"
            android:background="#FFFFFF"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:text="TextView" />

        <TextView
            android:id="@+id/textView3"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#FFFFFF"
            android:layout_marginTop="5dp"
            android:text="TextView" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayout3"
        android:layout_width="wrap_content"

        android:gravity="center"
        android:layout_height="match_parent" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:background="#FFFFFF" />

    </LinearLayout>

</LinearLayout>

<LinearLayout
    android:id="@+id/linearLayout4"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="5dp"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textView5"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#FFFFFF"
        android:text="TextView" />
    <TextView
        android:id="@+id/textView6"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:background="#FFFFFF"
        android:text="TextView" />
    <TextView
        android:id="@+id/textView7"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:background="#FFFFFF"
        android:text="TextView" />
    <TextView
        android:id="@+id/textView8"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:background="#FFFFFF"
        android:text="TextView" />
    <TextView
        android:id="@+id/textView9"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="5dp"
        android:background="#FFFFFF"
        android:text="TextView" />

</LinearLayout>
</LinearLayout>

答案 2 :(得分:0)

使用这种方式布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<RelativeLayout
    android:id="@+id/relativeLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_marginRight="21dp"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_toLeftOf="@+id/imageView1"
        android:layout_marginLeft="30dp"
        android:textColor="#fff"
        android:text="TextView" />

</RelativeLayout>

<RelativeLayout
    android:id="@+id/relativeLayout2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    >

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="30dp"
        android:text="TextViewaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"
        android:layout_alignBottom="@+id/textView1"></TextView>

</RelativeLayout>

并添加代码

   TextView tv1=(TextView)findViewById(R.id.textView1);
   tv1.setMaxHeight(maxHeight);

其中maxHeight动态获取imageview的高度

并且通过获取textview1的高度以将文本分配给第二个textview

来放置条件

可能有帮助你

像这样的{p> enter image description here我是对的吗?

答案 3 :(得分:0)