Android:语音气球 - ImageView重叠父级

时间:2014-04-10 06:39:22

标签: android xml relativelayout parent

我正在尝试让ImageView与其父级重叠并创建一个类似于复合视图的语音气球。 E.g:

Speech balloon

我无法让底部的三角形成为蓝色块的一部分,并与位于其下方的任何其他视图/控件重叠。

有没有人有办法做到这一点?

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

<LinearLayout
    android:id="@+id/appointment_ticket_signed_in_content_wrapper"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="@color/background_green" >

    <ImageView
        android:id="@+id/appointment_ticket_signed_in_icon"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:src="@drawable/ic_action_accept"
        android:contentDescription="@string/hello_world"
        android:layout_marginLeft="@dimen/activity_horizontal_margin"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        android:layout_marginRight="@dimen/activity_horizontal_margin"
        android:layout_marginBottom="@dimen/activity_vertical_margin" />

    <TextView
        android:id="@+id/appointment_ticket_signed_in_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/padding_large"
        android:layout_marginRight="@dimen/padding_large"
        android:layout_marginBottom="@dimen/padding_large"
        android:textColor="@android:color/white"
        android:textSize="18sp" />

</LinearLayout>

<ImageView
    android:id="@+id/appointment_ticket_signed_in_down_arrow"
    android:layout_width="25dp"
    android:layout_height="25dp"
    android:scaleType="centerInside"
    android:src="@drawable/triangle"
    android:contentDescription="@string/hello_world"
    android:layout_alignParentBottom="true"
    android:layout_gravity="bottom"
    android:paddingBottom="-25dp"
    android:background="@color/important_text_orange" />
</merge>

我认为上面的XML是要走的路,但似乎负边距或填充底部无法将视图推到其父级之外。 此XML位于relativelayout内。

有人知道答案吗?

  

修改

     

我的情况:

     

enter image description here

     

有没有办法在没有的情况下重叠下一个元素填充   直接访问它?

3 个答案:

答案 0 :(得分:3)

这是一个创建可以工作的东西的xml文件。尝试一下,让我知道:

<?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"
android:orientation="vertical"
android:padding="10sp" >

<ImageView
    android:layout_width="match_parent"
    android:layout_height="200sp"
    android:layout_below="@+id/complete_bubble"
    android:background="#123456" />

<RelativeLayout
    android:id="@+id/complete_bubble"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="-15sp" >

    <RelativeLayout
        android:id="@+id/main_block"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#000000"
        android:padding="10sp" >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Some text"
            android:textColor="#FFFFFF" />
    </RelativeLayout>

    <ImageView
        android:layout_width="20sp"
        android:layout_height="20sp"
        android:layout_below="@+id/main_block"
        android:layout_marginLeft="20sp"
        android:background="#000000" />
</RelativeLayout>

</RelativeLayout>

这种负利润率有效。

答案 1 :(得分:0)

方法1:使用气球图像作为RelativeLayout的背景图像,然后将TextView添加到该布局。

方法2(也是更棒的方法):创建一个自定义视图,不仅可以绘制语音气球,还可以使用setText(String)方法调整在气泡中绘制的文本并将其调整为始终适合文本。然后你开源并与世界分享。

如果您想创建自定义视图...

public class AwesomeTextBalloon extends View {
    // constructors here

    @Override
    protected void onDraw(Canvas canvas) {
        // first draw the balloon
        // then draw the text
    }

    public void setText(String newText) {
        // set text variable here
    }
}

然后以编程方式或在xml中添加View,并调用setText()来更改气球文本的值。

答案 2 :(得分:0)

尝试使用此

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

    <FrameLayout
        android:id="@+id/header2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dip"
        android:background="@android:color/transparent" />

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

    <HorizontalScrollView
        android:id="@+id/scroll"
        android:layout_width="320dip"
        android:layout_height="80dip"
        android:layout_below="@id/header2"
        android:background="@android:color/darker_gray"
        android:fadingEdgeLength="0dip"
        android:paddingLeft="1dip"
        android:scrollbars="none" >

        <LinearLayout
            android:id="@+id/appointment_ticket_signed_in_content_wrapper"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/background_green"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/appointment_ticket_signed_in_icon"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_marginBottom="@dimen/activity_vertical_margin"
                android:layout_marginLeft="@dimen/activity_horizontal_margin"
                android:layout_marginRight="@dimen/activity_horizontal_margin"
                android:layout_marginTop="@dimen/activity_vertical_margin"
                android:contentDescription="@string/hello_world"
                android:src="@drawable/ic_action_accept" />

            <TextView
                android:id="@+id/appointment_ticket_signed_in_text"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="@dimen/padding_large"
                android:layout_marginRight="@dimen/padding_large"
                android:layout_marginTop="@dimen/padding_large"
                android:textColor="@android:color/white"
                android:textSize="18sp" />
        </LinearLayout>
    </HorizontalScrollView>

    <FrameLayout
        android:id="@+id/footer"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/scroll"
        android:background="@android:color/transparent" />

    <ImageView
        android:id="@+id/arrow_down"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/footer"
        android:layout_marginTop="-1dip"
        android:src="@drawable/pop_dwn" />

</RelativeLayout>