0

iPhone には、任意のサイズに拡大するチャット バブルを作成するために使用できる stretchableimagewithleftcapwidth と呼ばれる UIImage のメソッドがあります (コーナーを自然なサイズに保ちます)。

Android にはこれがないようなので、FrameLayout で背景画像として使用できるレイアウトを作成することにしました。私が現在抱えている問題は、左上隅、伸縮可能な上部、右上隅の 3 つの列で構成される一番上の行です。左上隅と右上隅を固定サイズ (11dip) のままにし、中央に親の残りのスペースを埋めるように指示するにはどうすればよいですか? これは私がこれまでに持っているものです。

<?xml version="1.0" encoding="UTF-8"?>
    <merge xmlns:android="http://schemas.android.com/apk/res/android">
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/layout_bubble_container"
    android:orientation="vertical">    
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="11dip"
        android:id="@+id/layout_bubble_toprow"
        android:orientation="horizontal">    
        <LinearLayout
            android:id="@+id/layout_top_leftCorner"
            android:layout_width="11dip"
            android:layout_height="fill_parent"
            android:gravity="left|top">
            <ImageView
                android:id="@+id/bubble_top_leftcorner"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:src="@drawable/bubble_lefttop" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/layout_top"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:gravity="top|center" >

            <ImageView
                android:id="@+id/bubble_top"
                android:layout_width="match_parent"
                android:layout_height="fill_parent"
                android:scaleType="fitXY"
                android:src="@drawable/bubble_top" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/layout_top_rightCorner"
            android:layout_width="11dip"
            android:layout_height="fill_parent"
            android:gravity="right|top" >

            <ImageView
                android:id="@+id/bubble_top_rightcorner"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:src="@drawable/bubble_righttop" />
        </LinearLayout>    
    </LinearLayout>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="11dip"
        android:id="@+id/layout_bubble_middlerow"
        android:orientation="horizontal"
        android:background="@color/WHITE">    
        <LinearLayout
            android:id="@+id/layout_left"
            android:layout_width="match_parent"
            android:layout_height="fill_parent"
            android:gravity="left"
            android:layout_weight="1">
            <ImageView
                android:id="@+id/bubble_left"
                android:layout_width="11dip"
                android:layout_height="fill_parent"
                android:src="@drawable/bubble_left" />
        </LinearLayout>
        <LinearLayout
            android:id="@+id/layout_right"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="right" 
            android:layout_weight="1">

            <ImageView
                android:id="@+id/bubble_right"
                android:layout_width="11dip"
                android:layout_height="fill_parent"
                android:src="@drawable/bubble_right" />
        </LinearLayout>    
    </LinearLayout>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="11dip"
        android:id="@+id/layout_bubble_bottomrow"
        android:orientation="horizontal">    
        <LinearLayout
            android:id="@+id/layout_bottom_leftCorner"
            android:layout_width="11dip"
            android:layout_height="fill_parent"
            android:gravity="left|top">
            <ImageView
                android:id="@+id/bubble_bottom_leftcorner"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:src="@drawable/bubble_leftbottom" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/layout_bottom"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:gravity="top|center" >

            <ImageView
                android:id="@+id/bubble_bottom"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:scaleType="fitXY"
                android:src="@drawable/bubble_bottom" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/layout_bottom_rightCorner"
            android:layout_width="11dip"
            android:layout_height="fill_parent"
            android:gravity="right|top" >

            <ImageView
                android:id="@+id/bubble_bottom_rightcorner"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:src="@drawable/bubble_rightbottom" />
        </LinearLayout>    
    </LinearLayout>
</LinearLayout>

これが役立つ場合、Eclipse のレイアウト ツリーを次に示します。 視覚化されたレイアウト

これは、Eclipse のレイアウト エディターでレンダリングされたものです。上下の行が適切に伸びていないことに注意してください。

ここに画像の説明を入力

前もって感謝します。

4

1 に答える 1

1

アプリでチャット バブルのようなビューも必要だったので、背景画像として 9 パッチ ドローアブルを使用しましたが、正常に動作しています。

この質問を確認してください:

エミュレータでは 9 パッチのグラフィック サイズが正しく表示されるのに、電話では正しく表示されないのはなぜですか?

また、このリンク:

http://warting.se/2012/06/04/chat-bubbles-in-android/

于 2012-08-13T05:59:00.550 に答える