Androidはセパレーター/デバイダー線をレイアウトに描画しますか？

684

レイアウトの真ん中に線を引き、それをTextViewのような他のアイテムのセパレーターとして使用したいと思います。これに適したウィジェットはありますか？他のコンポーネントとのマッチングが難しいため、実際にはイメージを使用したくありません。そして、私はそれも相対的に配置されたいです。ありがとう

android  layout  draw 
— Androider
ソース

回答:

1684

私は通常、このコードを使用して水平線を追加します。

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="@android:color/darker_gray"/>

垂直セパレータを追加するには、layout_widthおよびlayout_height値を切り替えます

— アレックス・クチェレンコ
ソース
10
私もうまくいきます。android：layout_marginTop = "2dp"（など）を追加して、上部と下部にスペースを追加することもできます。
— 2012年
4
これは単純な水平線に最適です。ただし、最後に色あせが必要な場合は、ここで他の方法のいずれかを使用してください。
— スコットビッグス
91
または、より良い、使用layout_height="2dp" and android:background="?android:attr/listDivider"
— ダンDAR3
17
仕切りにはdpではなくpxを使用する必要があります。仕切りのサイズを実際に変化させ、場合によっては1/2ピクセル未満にしたくない場合を除きます。:)
— オースティンハンソン
9
マテリアルデザインの仕様では、1 dpの厚いgoogle.com/design/spec/components/dividers.html#dividers-specsを
— Alex Kucherenko
620

Alex KucherenkoとDan Dar3によって提供された回答を改善する

私はこれを自分のスタイルに追加しました：

<style name="Divider">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">1dp</item>
    <item name="android:background">?android:attr/listDivider</item>
</style>

それから私のレイアウトではコードが少なくて読みやすくなっています。

<View style="@style/Divider"/>
— toddles_fp
ソース
40
これはすばらしいことであり、私見が最善の解決策です！そうすれば、手動で色を設定する必要がないため、複数のテーマがある場合に一貫性が簡単になります（私はTheme.SherlockとTheme.Sherlock.Lightを使用しています）。
— Kopfgeldjaeger 2013年
2
+1-これまでに使用した9行の<Image>ソリューションの優れた代替品。非常に...スタイリッシュ
— AVIDeveloper 2013年
3
これは最もクリーンなソリューションのようです。ありがとう！
— FrozenCow 2014年
2
これは...仕事に思えるが、API 21とのAndroid Studioのプレビューでは表示されません...私はテストできなかった、これは実際のデバイス上でも、プレビューの唯一の問題である場合、または
— DominicM
3
Android Studioのプレビューにも表示されていないと思いましたが、プレビューでズームインした後、表示されるかすかな線を確認できます。
— Nick Spacek
136

これを、仕切りが必要なレイアウトに追加します（必要に応じて属性を変更します）。

<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@android:drawable/divider_horizontal_dark"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:scaleType="fitXY"
    android:paddingLeft="5dp"
    android:paddingRight="5dp"
    android:paddingBottom="2dp"
    android:paddingTop="2dp" />
— カミーユ・セヴィニー
ソース
1
ありがとう、私のために働きました。DrawerLayoutで特に見栄えが良い
— Martin Vysny
4
@Ahmedアクティビティの背景が白の場合は使用できません。その場合は、代わりにandroid：src = "@ android：drawable / divider_horizo​​ntal_bright"を使用してください。
— ロマノス2014
96

これはLinearLayout次の場所で使用できます。

android:divider="?android:dividerHorizontal"
android:showDividers="middle"

例えば： 

<?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:divider="?android:dividerHorizontal"
    android:showDividers="middle"
    android:orientation="vertical" >            

        <TextView 
         android:layout_height="wrap_content"
         android:layout_width="wrap_content"
         android:text="abcd gttff hthjj ssrt guj"/>

        <TextView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="abcd"/>
        <TextView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="abcd gttff hthjj ssrt guj"/>

        <TextView 
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:text="abcd"/>

</LinearLayout>
— user2240225
ソース
4
これはAPIレベル11からのみ利用可能であることに注意してください
— サン
残念ながら、この方法では仕切りが太字で強調表示されません。
— オリジナルのAndroid、
少ないほど良い！ありがとう
— pablo.vix
60

最も簡単な方法：

垂直仕切り：

<View style="@style/Divider.Vertical"/>

垂直分割ビュー

水平仕切り：

<View style="@style/Divider.Horizontal"/>

水平分割ビュー

それで全部です！

これを入れるだけ res>values>styles.xml

<style name="Divider">
    <item name="android:background">?android:attr/listDivider</item> //you can give your color here. that will change all divider color in your app.
</style>

<style name="Divider.Horizontal" parent="Divider">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">1dp</item> // You can change thickness here.

</style>

<style name="Divider.Vertical" parent="Divider">
    <item name="android:layout_width">1dp</item>
    <item name="android:layout_height">match_parent</item>
</style>
— ケムラジ
ソース
これはビュー全体とオーバーラップします。
— ChumiestBucket 2018年
56 
<TextView
    android:id="@+id/line"
    style="?android:attr/listSeparatorTextViewStyle"
    android:paddingTop="5dip"
    android:gravity="center_horizontal"
    android:layout_below="@+id/connect_help"
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000" />
— プラドス
ソース
1
私はこの方法を、既存のスタイルを使用しているという理由で他の方法よりも擁護しますが、すべての人を満足させるわけではありません。
— ソレノイド
3
ただし、このアプローチの欠点は、貧弱なAndroidが既存のスタイルを保証しないことです。
— Youngjae 2013
46

このコードを使用します。それが役立ちます

<LinearLayout
    android:layout_width="0dip"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    android:layout_weight="1"
    android:divider="?android:dividerHorizontal"
    android:gravity="center"
    android:orientation="vertical"
    android:showDividers="middle" >
— ディーパック・ゴエル
ソース
20

これを書いてください： 

 android:divider="?android:dividerHorizontal"
 android:showDividers="middle"

完全な例： 

<LinearLayout
        android:id="@+id/llTipInformation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tvServiceRating"
        android:orientation="horizontal"
        android:divider="?android:dividerHorizontal"
        android:layout_marginTop="@dimen/activity_horizontal_margin"
        android:showDividers="middle">

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/main.msg.tippercent"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/colorWhite"
            android:layout_marginTop="@dimen/activity_vertical_margin"/>
        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="@string/main.msg.tiptotal"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/colorWhite"
            android:layout_marginTop="@dimen/activity_vertical_margin"/>

</LinearLayout>
— ファリッドアーメド
ソース
1
それが仕切りを追加する最も正しい方法であるので、これは答えを受け入れられるべきであるLinearLayout
— JaydeepW
これはレイアウトのすべての要素に適用されます。
— Rami Alloush、2018
20 
<View
            android:layout_width="2dp"
            android:layout_height="match_parent"
            android:layout_marginTop="4dp"
            android:background="@android:color/darker_gray" />

2つのレイアウト間このコードを配置してDividerを取得します。

— SHASHWATどし
ソース
18

actionBarSherlockを使用する場合は、com.actionbarsherlock.internal.widget.IcsLinearLayoutクラスを使用して、分割線をサポートし、ビュー間で分割線を表示できます。

使用例：

<com.actionbarsherlock.internal.widget.IcsLinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:divider="@drawable/divider"
    android:dividerPadding="10dp"
    android:orientation="vertical"
    android:showDividers="beginning|middle|end" >
... children...

res / drawable / divider.xml：

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

    <size android:height="2dip" />

    <solid android:color="#FFff0000" />

</shape>

何らかの理由で、グラフィカルデザイナーのプレビューに "android.graphics.bitmap_delegate.nativeRecycle（I）Z"と表示されていることに注意してください。それが何を意味するかはわかりませんが、Androidの新しいバージョンと古いバージョン（Android 4.2と2.3でテスト済み）の両方で正常に機能するため、無視できます。

このエラーは、グラフィカルデザイナーでAPI17を使用した場合にのみ表示されるようです。

— Android開発者
ソース
12

このビューを追加します。あなたの間にセパレータを描画しますtextviews

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000000" />
— Elfekz
ソース
12

とてもシンプルです。背景色が黒のビューを作成するだけです。

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000"/>

これにより、背景色のある水平線が作成されます。他のビューと同様に、マージン、パディングなどの他の属性を追加することもできます。

— ウィジェイ・シャルマ
ソース
11

これがあなたの答えです。これはコントロール間に線を引く例です...

<TextView
            android:id="@+id/textView1"
            style="@style/behindMenuItemLabel1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="1dp"
            android:text="FaceBook Feeds" />

         <View
             android:layout_width="fill_parent"
             android:layout_height="2dp"
             android:background="#d13033"/>

         <ListView
            android:id="@+id/list1"
            android:layout_width="350dp"
            android:layout_height="50dp" />

このコードは、2つのコントロールの間に線を引きます...

— アルカンデサイ
ソース
10

レイアウトの任意の場所に水平方向の仕切りが追加されます。

    <TextView
       style="?android:listSeparatorTextViewStyle"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"/>
— カメル
ソース
この行は、Textviewの下にのみ表示されます。
— live-love
10

この<View>要素は、最初のTextViewの直後に使用できます。 

 <View
         android:layout_marginTop="@dimen/d10dp"
         android:id="@+id/view1"
         android:layout_width="fill_parent"
         android:layout_height="1dp"
         android:background="#c0c0c0"/>
— ヨゲシュ・サルヴァイヤ
ソース
8

ランタイムバージョン：

View dividerView = new View(getContext());
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(
    ViewGroup.LayoutParams.FILL_PARENT, UIUtils.dpToPix(getContext(), 1));
dividerView.setLayoutParams(lp);

TypedArray array = getContext().getTheme()
    .obtainStyledAttributes(new int[] {android.R.attr.listDivider});
Drawable draw = array.getDrawable(0);       
array.recycle();

dividerView.setBackgroundDrawable(draw);
mParentLayout.addView(dividerView);
— アルクサン
ソース
7

このxmlコードを使用して縦線を追加します

 <View
    android:layout_width="1dp"
    android:layout_height="match_parent"
    android:layout_centerVertical="true"
    android:background="#000000" />

このxmlコードを使用して水平線を追加します

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000000" />
— マクズドゥルハサンラジュ
ソース
6 
//for vertical line:

<View
   android:layout_width="1dp"
   android:layout_height="fill_parent"
   android:background="#00000000" />




//for horizontal line: 

<View
   android:layout_width="fill_parent"
   android:layout_height="1dp"
   android:background="#00000000" />
//it works like a charm
— 夢の開発者
ソース
6

一方が使用される場合にはandroid:layout_weight、例えば、レイアウト・コンポーネントに使用可能な画面スペースを割り当てるプロパティを

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
    </LinearLayout>

     /* And we want to add a verical separator here */

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
     </LinearLayout>

</LinearLayout>

画面スペース全体をすでに占めている既存の2つのレイアウトの間にセパレーターを追加するにandroid:weight:"1"は、3つの同じ幅の列が不要になるため、別のLinearLayoutを追加するだけではできません。代わりに、この新しいレイアウトに割り当てるスペースの量を減らします。最終的なコードは次のようになります。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
    </LinearLayout>

                    /* *************** ********************** */

    /* Add another LinearLayout with android:layout_weight="0.01" and 
       android:background="#your_choice" */
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.01"
        android:background="@android:color/darker_gray"
     />

    /* Or View can be used */
    <View
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:layout_marginTop="16dp"
        android:background="@android:color/darker_gray"
     />

                     /* *************** ********************** */

    <LinearLayout
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="match_parent"
        android:orientation="vertical">
        ...
        ...
    </LinearLayout>

</LinearLayout>

ここに画像の説明を入力してください

— サイクロトロン3x3
ソース
5

たくさん使うなら、一番いいことは

styles.xml：

<style name="Seperator">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">1dp</item>
        <item name="android:background">@color/light_color</item>
    </style>

今あなたのレイアウトに、次のように追加してください：

<View style="@style/Seperator" />
— イルシュ
ソース
4 
<ImageView
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="2dp"
    android:paddingLeft="5dp"
    android:paddingRight="5dp"
    android:paddingTop="2dp"
    android:scaleType="fitXY"
    android:src="?android:attr/listDivider" />
— コード511788465541441
ソース
android：src = "？android：attr / listDivider"を使用せずに.... android：background = "＃FFFFFF"を追加するだけ
— 14年
4

これを使用して水平の黒い線を追加します。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#000000"
    android:layout_marginTop="10dp"/>
— ジョティ・シャルマ
ソース
3

CamilleSévignyの回答を完成させるには、たとえば独自の線の形状を定義して、線の色をカスタマイズできます。

ドローアブルディレクトリにxmlシェイプを定義します。line_horizo​​ntal.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto" android:shape="line">
    <stroke android:width="2dp" android:color="@android:color/holo_blue_dark" />
    <size android:width="5dp" />
</shape>

希望の属性を使用してレイアウトでこの行を使用します。

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:paddingBottom="2dp"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:paddingTop="2dp"
        android:src="@drawable/line_horizontal" />
— LG
ソース
3

私は通常このコードを使用します：

<ImageView
    android:id="@+id/imageView2"
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:layout_alignParentLeft="true"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp"
    android:layout_marginTop="10dp"
    android:background="#aa000000" />

レイアウトにオブジェクトがあり、その下にImageViewでこの属性を使用する行を設定する場合：

android:layout_below="@+id/textBox1"
— ホセイン
ソース
3

これは、この問題を解決するのに役立ちます。ここでは、2つのビュー間のセパレーターとして黒い線を作成する小さなビューが作成されます。

 <View
        android:layout_width="3dp"
        android:layout_height="wrap_content"
        android:background="@android:color/black"
         />
— マヤンク・ガルグ
ソース
2 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<item
    android:bottom="0dp"
    android:left="-2dp"
    android:right="-2dp"
    android:top="-2dp">
    <shape android:shape="rectangle">
        <stroke
            android:width="1dp"
            android:color="@color/divider" />
    </shape>
</item>

— ファハドハンマドアロタイビ
ソース
2

これは、「2つのテキストビュー間の水平分割線」というコードです。これを試して

    <TextView
        android:id="@id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="5dp"
        android:inputType="textPersonName"
        android:text:"address" />


    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="@android:color/black"/>


    <TextView
        android:id="@id/textView7"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textPersonName" 
        android:text:"Upload File" />/>
— スニル
ソース
1

スペースを2つの等しい部分に分割します。 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:divider="?android:dividerHorizontal"
        android:showDividers="end"></LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"></LinearLayout>

</LinearLayout>

1つのパーツの最後に仕切りが含まれていることに注意してください

— ダンアルボテアヌ
ソース
1

シンプルなソリューション

このコードをレイアウトに追加し、 'Id_of__view_present_above'をビューのIDに置き換えてください。このIDの下には、仕切りが必要です。

<TextView
  android:layout_width="match_parent"
  android:layout_height="1dp"
  android:background="#c0c0c0"
  android:id="@+id/your_id"
  android:layout_marginTop="16dp" 
  android:layout_below="@+id/Id_of__view_present_above"
/>
— シュレッドハーバート
ソース
3
stackoverflow.com/help/how-to-answer Look for->Brevity is acceptable, but fuller explanations are better.
— Andy K
0

たとえば、アイテムにrecyclerViewを使用した場合：

build.gradleで：

dependencies {
    compile 'com.yqritc:recyclerview-flexibledivider:1.4.0'

色、サイズ、余白の値を設定する場合は、次のように指定できます。

RecyclerView recyclerView = (RecyclerView) 
findViewById(R.id.recyclerview);
recyclerView.addItemDecoration(
        new HorizontalDividerItemDecoration.Builder(this)
                .color(Color.RED)
                .sizeResId(R.dimen.divider)
                .marginResId(R.dimen.leftmargin, R.dimen.rightmargin)
                .build());
— モロゾフ
ソース
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.