2

在使用 XML 的 Android UI 设计中,如何将 ImageButton 与活动 xml 文件的背景完全对齐。

假设我有两张图片,一张作为活动的背景图片,第二张作为图片按钮源。

这是背景图像。 http://i.stack.imgur.com/e1Ow5.png

这是按钮图像。http://i.stack.imgur.com/m0tUU.png

我会将第一张图片设置为活动的背景。我的问题是如何正确放置和对齐第二张图像,即按钮正好位于背景的“中心矩形”内。“中心矩形”是占位符,它可以在屏幕的任何位置。

不:我尝试使用相对布局,但是,不能真正根据背景放置按钮。

编辑:- 实际上背景中心的矩形和圆角矩形只是一个占位符。它可以是任何东西,甚至什么都不是。或者它可以在任何地方。它可能不在中心。考虑整个图像,我需要将按钮图像放在占位符所在的位置。这就是我的意图。例如,考虑一个收音机应用程序,其中有一个用作音量摇杆的转动按钮。图像中的其他所有内容都是背景,音量摇杆可能是不同的图像。

4

3 回答 3

0
    <?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="match_parent" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/img_bg" />

    </RelativeLayout>

drawable/img_bg.xml
    <?xml version="1.0" encoding="utf-8"?>
    <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

        <item android:drawable="@drawable/bg">
        </item>
        <item android:drawable="@drawable/fr">
        </item>

    </layer-list>

or

    <?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="match_parent" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:src="@drawable/bg" />

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignTop="@+id/imageView1"
            android:src="@drawable/fr" />

    </RelativeLayout>

bg.png 和 fr.png 是具有相同高度和宽度的透明图像。 bg.png fr.png 最终图片

于 2014-09-24T12:51:46.920 回答
0

答案是您尝试这样做的方式是不可能的。

你想要做的是进一步削减背景,使按钮居中。

因此,以您的图像为例,这是视图层次结构的外观

->FrameLayout1
---->Framelayout2
-------->Button

FrameLayout1 将是没有内部正方形的背景

FrameLayout2 将是内部正方形

Button 将作为按钮资源并放置在 FrameLayout 2 的中心。

除此之外,您还需要其他技术使其看起来像素完美,例如使用 9 个补丁可绘制对象。

于 2014-09-24T04:53:46.283 回答
0

考虑到您正在尝试横向模式(您的图像看起来如此)您可以尝试以下代码。

bg:你的背景

img:你的中心形象

<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"
    android:background="@drawable/bg" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:src="@drawable/img" />

</RelativeLayout>
于 2014-09-24T05:28:52.693 回答