在 LinearLayout 中将 textview 放在 Imageview 上
Put a textview over Imageview in LinearLayout
我卡在了一些 xml 代码中,希望你能帮助我。
这就是我 need/what 目前所做的。
我有 3 张宽度为 650 像素的图片,我需要在保持宽高比的同时将它们一张放在另一张下面。
我用下面的代码做到了,它看起来应该如此。这里没问题。
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/ll"
android:orientation="vertical"
android:background="#3afa3f"
android:weightSum="3">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/krk_history"
android:layout_weight="1"
android:background="@drawable/povjestkrka_vintage_yellow600" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="@+id/krk_frankopan"
android:background="@drawable/frankopan2_vintage_sundown600" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="@+id/krk_turizam"
android:background="@drawable/krk_turizam_vintage"/>
问题是。我需要在每张图片的左下角放置三个文本视图。把它想象成图像菜单,每张图像上都有文字描述。
所以,我不能使用相对或框架布局,因为图像不能很好地相互播放 :) 宽高比等之间总是有差距。我需要权重和。
其次,我无法在 photoshop 中对每张图片上的文本进行硬编码,因为应用程序将被翻译,文本需要针对每种语言进行更改。
我可以为每种语言设置不同的图像,但我正在努力避免这种情况。
啊,是的,还有最后一件事。
我试图将整个线性布局放在相对布局中,并将文本放在它们之间,但文本出现在图像下方,我无法将其放在前面。
有什么建议吗?
非常感谢,
Xsonz
在你的 LinearLayout
中取三个 FrameLayout
,在 FrameLayout
中保留 ImageView 和 TextView。
或者您可以使用 RelativeLayout
并将 dependency 赋予 Views
您可以在线性布局中使用框架布局。在线性布局中创建 imageview,并在其下方的另一个框架布局中创建 textview。
<FrameLayout
android:id="@+id/frameLayout_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/krk_history"
android:layout_weight="1"
android:background="@drawable/povjestkrka_vintage_yellow600" />
</FrameLayout>
<FrameLayout
android:id="@+id/frameLayout_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="-5dp" >
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="string" />
</FrameLayout>
只需复制此内容:
<?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">
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="@+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 1" />
</FrameLayout>
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="@+id/imageView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 2" />
</FrameLayout>
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="@+id/imageView3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 3" />
</FrameLayout>
类似的内容可能适合您。
//your layout -> LinearLayout>
....
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/image1"
android:layout_weight="1"
android:background="@drawable/A1" />
<TextView android:id="@+id/textview1"
android:layout_margin="0dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="My Text"
android:layout_below="@id/image1"
android:layout_alignLeft="@id/image1" />
</RelativeLayout>
// end your LinearLayout
您可以使用 Relative Layout Parameters android.com 使用这些参数。相对布局允许您控制元素之间的 "relative" 定位。
您可以将图像并排放置,也可以按照您希望的任何方式放置。
然后就可以动态调整文字了。
我卡在了一些 xml 代码中,希望你能帮助我。
这就是我 need/what 目前所做的。
我有 3 张宽度为 650 像素的图片,我需要在保持宽高比的同时将它们一张放在另一张下面。
我用下面的代码做到了,它看起来应该如此。这里没问题。
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/ll"
android:orientation="vertical"
android:background="#3afa3f"
android:weightSum="3">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/krk_history"
android:layout_weight="1"
android:background="@drawable/povjestkrka_vintage_yellow600" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="@+id/krk_frankopan"
android:background="@drawable/frankopan2_vintage_sundown600" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="@+id/krk_turizam"
android:background="@drawable/krk_turizam_vintage"/>
问题是。我需要在每张图片的左下角放置三个文本视图。把它想象成图像菜单,每张图像上都有文字描述。
所以,我不能使用相对或框架布局,因为图像不能很好地相互播放 :) 宽高比等之间总是有差距。我需要权重和。
其次,我无法在 photoshop 中对每张图片上的文本进行硬编码,因为应用程序将被翻译,文本需要针对每种语言进行更改。
我可以为每种语言设置不同的图像,但我正在努力避免这种情况。
啊,是的,还有最后一件事。 我试图将整个线性布局放在相对布局中,并将文本放在它们之间,但文本出现在图像下方,我无法将其放在前面。
有什么建议吗?
非常感谢, Xsonz
在你的 LinearLayout
中取三个 FrameLayout
,在 FrameLayout
中保留 ImageView 和 TextView。
或者您可以使用 RelativeLayout
并将 dependency 赋予 Views
您可以在线性布局中使用框架布局。在线性布局中创建 imageview,并在其下方的另一个框架布局中创建 textview。
<FrameLayout
android:id="@+id/frameLayout_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/krk_history"
android:layout_weight="1"
android:background="@drawable/povjestkrka_vintage_yellow600" />
</FrameLayout>
<FrameLayout
android:id="@+id/frameLayout_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="-5dp" >
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="string" />
</FrameLayout>
只需复制此内容:
<?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">
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="@+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 1" />
</FrameLayout>
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="@+id/imageView2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 2" />
</FrameLayout>
<FrameLayout android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<ImageView
android:id="@+id/imageView3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/ic_launcher" />
<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|bottom"
android:padding="5dp"
android:text="Text 3" />
</FrameLayout>
类似的内容可能适合您。
//your layout -> LinearLayout>
....
<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/image1"
android:layout_weight="1"
android:background="@drawable/A1" />
<TextView android:id="@+id/textview1"
android:layout_margin="0dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="My Text"
android:layout_below="@id/image1"
android:layout_alignLeft="@id/image1" />
</RelativeLayout>
// end your LinearLayout
您可以使用 Relative Layout Parameters android.com 使用这些参数。相对布局允许您控制元素之间的 "relative" 定位。 您可以将图像并排放置,也可以按照您希望的任何方式放置。
然后就可以动态调整文字了。