2016-07-22 14 views
1

enter image description here私はここで、この写真のレイアウトの下の境界線にある三角形の境界線があり、それは下の画像

に示すように、レイアウトの境界線を作りたいです。私は国境を作ったが、私は国境にその三角マークを作る方法を得ていない。私が共有しているコードをチェックしてください。

enter code here 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle"> 

<stroke android:width="0.5dp" android:color="@color/light_grey" /> 
<gradient android:startColor="@color/white" android:endColor="@color/white" 
    /> 

<corners android:radius="5dp" /> 

</shape> 

これは私のコードです。

+1

何9パッチの使用について? –

+1

9パッチイメージを使用する必要があります。 –

+0

私はxmlでできることを何でも教えてくれますので、私はそのレイアウトの境界線を得ることはできません。 –

答えて

1

Bob Maloogaが述べたように、9つのパッチイメージ全体を「バブル」レイアウトで使用したり、独自の「バブル」を描くことができます。

9パッチイメージを使用したくない場合は、下記のようにレイアウトを達成できます。

TriangelのDrawableのレイアウト:

オーバーレイフラグメントレイアウト(私はTextViewsの背景として、あなたの "バブル" の背景を使用)

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item> 
     <rotate 
      android:fromDegrees="-45" 
      android:pivotX="0%" 
      android:pivotY="0%" 
      android:toDegrees="0"> 
      <shape android:shape="rectangle"> 
       <solid android:color="@color/white" /> 
      </shape> 
     </rotate> 
    </item> 
</layer-list> 

<?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="wrap_content" 
     android:padding="16dp"> 

     <TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginBottom="33dp" 
      android:background="@drawable/your_bubble_bg" 
      android:padding="16dp" 
      android:text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum." 
      android:textColor="@android:color/black" /> 

     <View 
      android:layout_width="48dp" 
      android:layout_height="34dp" 
      android:layout_gravity="bottom|right" 
      android:layout_marginRight="32dp" 
      android:background="@drawable/triangle" /> 
    </FrameLayout> 

</LinearLayout> 

結果:あなたがすることもでき result of the Overlay fragment layout code

三角形をカスタム三角形描画可能に変更し、それをimageViews "src"として使用します。

<?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="wrap_content" 
     android:padding="16dp"> 

     <TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginBottom="33dp" 
      android:background="@drawable/triangle_b" 
      android:padding="16dp" 
      android:text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum." 
      android:textColor="@android:color/black" /> 

     <ImageView 
      android:layout_width="48dp" 
      android:layout_height="34dp" 
      android:layout_gravity="bottom|right" 
      android:layout_marginRight="32dp" 
      android:src="@drawable/your_custom_triangle_drawable" /> 
    </FrameLayout> 

</LinearLayout> 

それとも、一つだけ描画可能で、それをachiveすることができます:あなたのレイアウトコードがなることをした後

背景レイアウト(merged_bubble_bg):

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:bottom="33dp"> 
     <shape xmlns:android="http://schemas.android.com/apk/res/android" 
      android:shape="rectangle"> 

      <stroke 
       android:width="0.5dp" 
       android:color="@color/grey_light" /> 
      <gradient 
       android:endColor="@color/white" 
       android:startColor="@color/white" /> 

      <corners android:radius="5dp" /> 

     </shape> 

    </item> 
    <item 
     android:width="48dp" 
     android:height="34dp" 
     android:gravity="bottom|right" 
     android:right="32dp"> 
     <rotate 
      android:fromDegrees="-45" 
      android:pivotX="0%" 
      android:pivotY="0%" 
      android:toDegrees="0"> 
      <shape android:shape="rectangle"> 
       <solid android:color="@color/white" /> 
      </shape> 
     </rotate> 
    </item> 
</layer-list> 

使用における上記コード:

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

    <TextView 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="33dp" 
     android:background="@drawable/merged_bubble_bg" 
     android:paddingBottom="40dp" 
     android:paddingLeft="16dp" 
     android:paddingRight="16dp" 
     android:paddingTop="16dp" 
     android:text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum." 
     android:textColor="@android:color/black" /> 

</LinearLayout> 
+0

答えがペッティンになってくれてありがとうございました。 –

+0

答えのために@petinに感謝してくれてありがとう.... –

関連する問題