Android วาดเส้นแนวนอนระหว่างมุมมอง


105

ฉันมีเค้าโครงของฉันดังนี้:

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

<TextView
        android:id="@+id/textView1"
        style="@style/behindMenuItemLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="Twitter Feeds"
        android:textStyle="bold" />

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

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

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

</LinearLayout>

ความต้องการของฉันคือการวาดเส้นแนวนอนระหว่างTextViewและListView

ใครสามารถช่วย?


คุณสามารถเพิ่มบรรทัดลงในพื้นหลังของมุมมองที่มีอยู่และไม่เพิ่มอีก หรือคุณสามารถใส่มุมมองทั้งหมดของคุณไว้ใน listView listView สามารถวาดตัวคั่น วิธีที่ง่ายที่สุดคือการเพิ่มมุมมองพิเศษ
Leonidos

คำตอบ:


285

มันจะวาดเส้นสีเทาเงินระหว่างTextView&ListView

<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="match_parent"
    android:layout_height="2dp"
    android:background="#c0c0c0"/>

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

10
สีฮาร์ดโค้ดนี้เหมือนกับการใช้ inline css ในเว็บเพจ ทำไมถึงได้รับการโหวตมากขนาดนี้? ควรใช้ android: background = "? android: attr / dividerHorizontal" เป็นต้น
Roel

4
เพราะง่ายต่อการนำไปใช้
Denny

1
@Roel เป็นเรื่องง่ายง่ายและได้ผล และมันตรงไปตรงมาที่จะอ้างอิงสีแทนการเข้ารหัส ฉันลองทำตามคำแนะนำของคุณแล้วซึ่งฉันคิดว่าจะดีกว่าในทางเทคนิค แต่ดูเหมือนจะไม่ได้ผล - ฉันไม่ได้รับตัวแบ่งใด ๆ ในเค้าโครงของฉัน ฉันควรใช้มันอย่างไร? ขอบคุณ.
nsandersen

23

คุณควรใช้มุมมองใหม่ที่มีน้ำหนักเบาSpaceเพื่อวาดเส้นแบ่ง รูปแบบของคุณจะโหลดเร็วขึ้นถ้าคุณจะใช้แทน Space ตัวแบ่งแนวนอน:View

<android.support.v4.widget.Space
        android:layout_height="1dp"
        android:layout_width="match_parent" /> 

ตัวแบ่งแนวตั้ง:

<android.support.v4.widget.Space
        android:layout_height="match_parent"
        android:layout_width="1dp" />

คุณยังสามารถเพิ่มพื้นหลัง:

<android.support.v4.widget.Space
        android:layout_height="match_parent"
        android:layout_width="1dp"
        android:background="?android:attr/listDivider"/>

ตัวอย่างการใช้งาน:

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

<android.support.v4.widget.Space
    android:layout_height="match_parent"
    android:layout_width="1dp"
    android:background="?android:attr/listDivider"/>

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

<android.support.v4.widget.Space
    android:layout_height="match_parent"
    android:layout_width="1dp"
    android:background="?android:attr/listDivider"/>

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

ในการใช้งานSpaceคุณควรเพิ่มการอ้างอิงในbuild.gradleของคุณ:

dependencies {
    compile 'com.android.support:support-v4:22.1.+'
}

เอกสารประกอบhttps://developer.android.com/reference/android/support/v4/widget/Space.html


11
การใช้งานSpaceเป็นไปได้อย่างน่าผิดหวังเนื่องจากSpaceไม่ได้ใช้อะไรเลย (ไม่ใช่พื้นหลัง) มีหน้าที่อย่างเดียวคือใช้พื้นที่บนหน้าจอ วิธีแก้คือใช้วานิลลาเอViewลิเมนต์แทน จากนั้นจะวาดพื้นหลังตามที่ต้องการ (จากนั้นคุณสามารถหลีกเลี่ยงการพึ่งพาไลบรารีสนับสนุนได้หากไม่จำเป็นต้องใช้เป็นอย่างอื่น)
Ted Hopp

6
Spaceสืบทอดจากและดังนั้นจึงสืบทอดคุณลักษณะทั้งหมดที่กำหนดโดยView View(ในทำนองเดียวกันLinearLayoutสืบทอดtextAlignmentแอตทริบิวต์แม้ว่าจะไม่ได้แสดงข้อความใด ๆ ก็ตาม) อย่าลังเลที่จะทดสอบสิ่งนี้ด้วยตัวคุณเอง (หรือเพียงแค่ดูซอร์สโค้ด) และคุณจะพบว่ามีการSpaceละเว้นแอตทริบิวต์ที่เกี่ยวข้องกับการวาดภาพทั้งหมด
Ted Hopp

ใช่Spaceไม่ได้วาดพื้นหลัง แต่โปร่งใส
vovahost

21

เพิ่มสิ่งนี้ในเค้าโครงของคุณระหว่างมุมมองที่คุณต้องการแยก:

  <View
       android:id="@+id/SplitLine_hor1"
       android:layout_width="match_parent"
       android:layout_height= "2dp"
       android:background="@color/gray" />

หวังว่าจะช่วยได้ :)


2
มันจะลากเส้นแนวตั้งเนื่องจากความสูงตรงกันและความกว้างเพียง 2 dp
Bhoomika Brahmbhatt

14

การสร้างครั้งเดียวและใช้ได้ทุกที่ที่ต้องการถือเป็นความคิดที่ดี เพิ่มสิ่งนี้ใน styles.xml ของคุณ:

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

และเพิ่มสิ่งนี้ในโค้ด xml ของคุณซึ่งจำเป็นต้องใช้ตัวแบ่งบรรทัด:

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

คำตอบเดิมโดย toddles_fp สำหรับคำถามนี้: Android Drawing Separator / Divider Line ใน Layout?



6
<View
       android:id="@+id/view"
       android:layout_width="match_parent"
       android:layout_height="2dp"
       android:background="#000000" />

เราไม่สามารถเข้าถึงองค์ประกอบนี้โดยทางโปรแกรมได้หรือไม่?
gumuruh

2

คุณสามารถวางมุมมองนี้ไว้ระหว่างมุมมองของคุณเพื่อเลียนแบบเส้น

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

2

ลองใช้วิธีนี้สำหรับฉัน

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

1

ในแต่ละพาเรนต์LinearLayoutที่คุณต้องการแบ่งระหว่างส่วนประกอบให้เพิ่มandroid:divider="?android:dividerHorizontal"หรือandroid:divider="?android:dividerVerticalหรือ

เลือกที่เหมาะสมระหว่างพวกเขาตามการวางแนวของคุณ LinearLayoutเลือกที่เหมาะสมระหว่างพวกเขาเป็นต่อทิศทางของคุณ

ถึงฉันจะรู้ว่ารูปแบบทรัพยากรนี้ถูกเพิ่มจาก Android 4.3



0

มุมมองที่คุณสามารถระบุสีพื้นหลังได้ (ความสูง = ไม่กี่ dpi) ดูในรหัสจริงและนี่คือ:

        <LinearLayout
            android:id="@+id/lineA"
            android:layout_width="fill_parent"
            android:layout_height="2dp"
            android:background="#000000" />

Viewทราบว่าอาจจะเป็นชนิดใด


0

----> ง่ายๆ

 <TextView
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="#c0c0c0"
    android:id="@+id/your_id"
    android:layout_marginTop="160dp" />

0

หากคุณไม่ต้องการใช้มุมมองพิเศษสำหรับขีดเส้นใต้ เพิ่มสไตล์นี้ในtextViewไฟล์.

style="?android:listSeparatorTextViewStyle"

ด้านล่างมันจะเพิ่มคุณสมบัติพิเศษเช่น

android:textStyle="bold"
android:textAllCaps="true"

ซึ่งคุณสามารถลบล้างได้อย่างง่ายดาย

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.