Linie verticală utilizând XML drawable (Programare, Android, Aspect Android, Linie, Android Xml, Android Drawable)

Kaspa a intrebat.

Încerc să-mi dau seama cum să definesc o linie verticală (1dp grosime) pentru a fi folosită ca drawable.

Pentru a face una orizontală, este destul de simplu:

<shape xmlns_android="http://schemas.android.com/apk/res/android" android_shape="line">
    <stroke android_width="1dp" android_color="#0000FF"/>
    <size android_height="50dp" />     
</shape>

Întrebarea este, cum să fac această linie verticală?

Da, există soluții de rezolvare, cum ar fi desenarea unei forme dreptunghiulare cu grosimea de 1px, dar asta complică XML-ul drawable, dacă acesta este format din mai multe <item> elemente.

A avut cineva vreo șansă cu acest lucru?

UPDATE

Cazul este încă nerezolvat. Cu toate acestea,Pentru oricine se află într-o cruciadă de documentare Android – s-ar putea găsi acest lucru util:Lipsește manualul Android XML

UPDATE

Nu am găsit altă cale decât cea pe care am marcat-o ca fiind corectă. Face trucul, deși se simte un pic „greu”, astfel, dacă se întâmplă să știți răspunsul nu uitați să împărtășiți 😉

17 răspunsuri
CommonsWare

În loc de o formă, ai putea încerca un View:

<View
    android_layout_width="1dp"
    android_layout_height="match_parent"
    android_background="#FF0000FF" />

Am folosit acest lucru doar pentru linii orizontale, dar cred că ar funcționa și pentru linii verticale.

Utilizați:

<View
    android_layout_width="match_parent"
    android_layout_height="1dp"
    android_background="#FF0000FF" />

pentru o linie orizontală.

Comentarii

  • mulțumesc Mark :)! Sunt conștient că pot folosi o vizualizare pentru a realiza acest lucru. Problema este că asamblez o vizualizare ceva mai complexă pe care vreau să o folosesc ca element desenabil pentru fundalul unei celule de tabel. Există diferite tipuri de forme/gradiente/linii acolo. Folosirea unei vizualizări AR FI o soluție, însă ar trebui să o pun într-un alt „layer” de desenare și asta înseamnă potențial să te împuști în picior atunci când mă voi confrunta cu redimensionarea etc. Mă întreb doar de ce nu există o documentație pe xmls „shape”, poate cineva de la google ne poate lămuri 🙂 –  > Por Kaspa.
  • Folosirea marginRight/Start și Left/End este, de asemenea, uneori interesantă pentru a obține spațiu pe laterale. –  > Por George.
cephus

Puteți să vă aninați forma în interiorul unei etichete rotate.

<rotate xmlns_android="http://schemas.android.com/apk/res/android"
    android_fromDegrees="90"
    android_toDegrees="90">
    <shape 
        android_shape="line">
        <stroke
            android_width="1dp"
            android_color="#ff00ff"
            android_dashWidth="1dp"
            android_dashGap="2dp" />
    </shape>
</rotate>

Cu toate acestea, singura problemă este că parametrii de aspect definiți în layout xml vor fi dimensiunile utilizate pentru a desena forma originală. Adică dacă vrei ca linia ta să fie înaltă de 30dp, trebuie să definești o layout_width de 30dp în layout xml. Dar lățimea finală va fi, de asemenea, de 30dp în acest caz, ceea ce este probabil nedorit în majoritatea situațiilor. Acest lucru înseamnă, în esență, că atât lățimea, cât și înălțimea trebuie să aibă aceeași valoare, valoarea lungimii dorite pentru linie. Nu mi-am dat seama cum să rezolv acest lucru.

Aceasta pare a fi soluția „android way”, dar dacă nu există o soluție sau o soluție pentru problema dimensiunilor pe care am menționat-o, atunci probabil că nu va funcționa pentru majoritatea oamenilor. Ceea ce avem nevoie cu adevărat este un atribut de orientare în <shape/> sau <stroke/>.

De asemenea, puteți încerca să faceți referire la un alt drawable în atributele etichetei rotate, cum ar fi:

<rotate xmlns_android="http://schemas.android.com/apk/res/android"
    android_fromDegrees="90"
    android_toDegrees="90"
    android_drawable="@drawable/horizontal_line" />

Cu toate acestea, nu am testat acest lucru și mă aștept să aibă aceleași probleme.

— EDITARE —

Oh, de fapt am găsit o soluție. Puteți utiliza o marjă negativă în layout-ul xml pentru a scăpa de spațiul suplimentar nedorit. cum ar fi:

<ImageView
    android_layout_width="35dp"
    android_layout_height="35dp"
    android_layout_marginLeft="-15dp"
    android_layout_marginRight="-15dp"
    android_src="@drawable/dashed_vertical_line" />

Comentarii

  • în timp ce marja negativă va funcționa pentru 99% din dispozitive….să știți, există dispozitive care vor Forța închiderea dacă faceți acest lucru. Unele dispozitive au probleme cu umflarea unei margini negative –  > Por Kent Andersen.
  • @cephus Folosesc primul tău cod, dar am nevoie de linia de deasupra vizualizării. Este în centrul vizualizării mele. Cum pot seta o gravitație pentru ea(în interiorul fișierului xml de formă)? –  > Por Behzad.
utilizator4679242

Puteți utiliza atributul rotate

 <item>
    <rotate
        android_fromDegrees="90"
        android_toDegrees="90"
        android_pivotX="50%"
        android_pivotY="50%" >
        <shape
            android_shape="line"
            android_top="1dip" >
            <stroke
                android_width="1dip"
                 />
        </shape>
    </rotate>
</item>

Comentarii

  • Acesta este cu siguranță un răspuns mai bun (sau cel mai bun), deoarece, în timp ce răspunsul lui @commonsware este suficient pentru liniile verticale normale. Dacă nu dorim să creăm linii punctate (să zicem, de exemplu, acesta este singurul răspuns care ar funcționa corect. –  > Por Subin Sebastian.
logcat
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns_android="http://schemas.android.com/apk/res/android"
  android_shape="rectangle" >
    <stroke android_width="1dp" android_color="@color/white" />
    <size android_width="2dp" />
</shape>

Funcționează pentru mine . Puneți-l ca fundal al vizualizării cu fill_parent sau cu dimensiuni fixe în dp height

a.ch.

Cred că asta e cea mai simplă soluție:

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

    <item
        android_gravity="center">
        <shape android_shape="rectangle">
            <size android_width="1dp" />
            <solid android_color="#0000FF" />
        </shape>
    </item>

</layer-list>

Comentarii

  • Minunat. Adăugați android:height la size dacă doriți să controlați și această dimensiune. –  > Por Giulio Piancastelli.
Eric Kok

Am venit cu o soluție diferită. Ideea este de a umple mai întâi drawable-ul cu culoarea pe care doriți să o aibă linia și apoi să umpleți din nou întreaga zonă cu culoarea de fundal, folosind în același timp padding stânga sau dreapta. Evident, acest lucru funcționează doar pentru o linie verticală în extrema stângă sau dreaptă a drawable-ului.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns_android="http://schemas.android.com/apk/res/android" >
    <item android_drawable="@color/divider_color" />
    <item android_left="6dp" android_drawable="@color/background_color" />
</layer-list>

Comentarii

  • Aveam nevoie de fundal cu margini în stânga, dreapta, jos și acest lucru a funcționat pentru mine, mulțumesc! –  > Por Andrii Chernenko.
  • Minunat, cu acest lucru am reușit să creez divizoare îngrijite în LinearLayout-ul meu (showDividers="middle"). Pentru a obține un separator 2dp, a trebuit să specific android:left="3dp" aici. –  > Por Jonik.
  • Sfat: pentru a face ca acest drawable să fie util mai general, utilizați @android:color/transparent în loc de codarea dură @color/background_color. –  > Por Jonik.
  • De fapt, pentru nevoile mele de divizoare verticale, această soluție este chiar mai simplă. 🙂 –  > Por Jonik.
  • @Jonik Sigur, dar asta funcționează doar cu o vizualizare cu înălțime fixă, nu și cu wrap_content. –  > Por Eric Kok.
willlma

Aveam nevoie să adaug vizualizările în mod dinamic/programatic, așa că adăugarea unei vizualizări suplimentare ar fi fost greoaie. Înălțimea vizualizării mele era WRAP_CONTENT, așa că nu am putut folosi soluția dreptunghiulară. Am găsit o postare pe blog aici despre extinderea TextView, suprascrierea onDraw() și pictura în linie, așa că am implementat acest lucru și funcționează bine. Vedeți codul meu de mai jos:

public class NoteTextView extends TextView {
    public NoteTextView(Context context) {
       super(context);
    }
    private Paint paint = new Paint();
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        paint.setColor(Color.parseColor("#F00000FF"));
        paint.setStrokeWidth(0);
        paint.setStyle(Paint.Style.FILL);
        canvas.drawLine(0, 0, 0, getHeight(), paint);
    }
}

Aveam nevoie de o linie verticală în stânga, dar parametrii liniei de desen sunt drawLine(startX, startY, stopX, stopY, paint) astfel încât să puteți desena orice linie dreaptă în orice direcție în întreaga vizualizare. Apoi, în activitatea mea amNoteTextView note = new NoteTextView(this);Sper că acest lucru vă ajută.

user3130068

este foarte simplu… pentru a adăuga o linie verticală în android xml…

<View
android_layout_width="fill_parent"
android_layout_height="1dp"
android_layout_marginTop="5dp"
android_rotation="90"
android_background="@android:color/darker_gray"/>

Comentarii

  • Acest lucru funcționează foarte bine atunci când nu puteți utiliza fill_parent pentru înălțime, deoarece înălțimea părintelui este setată la wrap_content. –  > Por Sergey Aldoukhov.
Lukas1

Depinde, unde doriți să aveți linia verticală, dar dacă doriți o margine verticală, de exemplu, puteți face ca vizualizarea părintelui să aibă un fundal un drawable personalizat. Și apoi puteți defini drawable-ul astfel:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns_android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape
            android_shape="rectangle">
            <stroke android_width="1dp" android_color="#000000" />
            <solid android_color="#00ffffff" />

        </shape>
    </item>

    <item android_right="1dp">
        <shape android_shape="rectangle">
            <solid android_color="#00ffffff" />
        </shape>
    </item>

</layer-list>

Acest exemplu va crea o linie neagră subțire de 1dp în partea dreaptă a vizualizării, care va avea acest drawable ca fundal.

AnupamChugh
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns_android="http://schemas.android.com/apk/res/android">

    <item
        android_bottom="-3dp"
        android_left="-3dp"
        android_top="-3dp">

        <shape android_shape="rectangle">
            <solid android_color="@color/colorPrimary" />
            <stroke
                android_width="2dp"
                android_color="#1fc78c" />
        </shape>

    </item>

</layer-list>

Sergey Neskoromny

Se pare că nimeni nu a menționat această opțiune:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns_android="http://schemas.android.com/apk/res/android" >
    <item android_drawable="@color/white" android_width="1dp"/>
</layer-list>

Boxlady

Poți folosi o formă, dar în loc de o linie fă-o dreptunghiulară.

android:shape="rectangle">
<stroke
    android_width="5dp"
    android_color="#ff000000"
    android_dashGap="10px"
    android_dashWidth="30px" />

și în layout-ul dvs. folosiți acest lucru…

<ImageView
    android_layout_width="7dp"
    android_layout_height="match_parent"
    android_src="@drawable/dashline"
    android_layout_alignParentTop="true"
    android_layout_centerHorizontal="true"
    android_layerType="software"/>

S-ar putea să trebuiască să vă jucați cu lățimea, în funcție de dimensiunea liniuțelor, pentru a o obține într-o singură linie.

Sperăm că vă va fi de ajutor.

YasirAzgar
add this in your styles.xml

        <style name="Divider">
            <item name="android:layout_width">1dip</item>
            <item name="android:layout_height">match_parent</item>
            <item name="android:background">@color/divider_color</item>
        </style>

        <style name="Divider_invisible">
            <item name="android:layout_width">1dip</item>
            <item name="android:layout_height">match_parent</item>
        </style>

then wrap this style in a linear layout where you want the vertical line, I used the vertical line as a column divider in my table. 

     <TableLayout
                android_id="@+id/table"
                android_layout_width="match_parent"
                android_layout_height="wrap_content"
                android_orientation="horizontal"
                android_stretchColumns="*" >

                <TableRow
                    android_id="@+id/tableRow1"
                    android_layout_width="fill_parent"
                    android_layout_height="match_parent"
                    android_background="#92C94A" >

                    <TextView
                        android_id="@+id/textView11"
                        android_paddingBottom="10dp"
                        android_paddingLeft="5dp"
                        android_paddingRight="5dp"
                        android_paddingTop="10dp" />
    //...................................................................    

                    <LinearLayout
                        android_layout_width="1dp"
                        android_layout_height="match_parent" >

                        <View style="@style/Divider_invisible" />
                    </LinearLayout>
        //...................................................................
                    <TextView
                        android_id="@+id/textView12"
                        android_paddingBottom="10dp"
                        android_paddingLeft="5dp"
                        android_paddingRight="5dp"
                        android_paddingTop="10dp"
                        android_text="@string/main_wo_colon"
                        android_textColor="@color/white"
                        android_textSize="16sp" />
  //...............................................................  
                    <LinearLayout
                        android_layout_width="1dp"
                        android_layout_height="match_parent" >

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

    //...................................................................
                    <TextView
                        android_id="@+id/textView13"
                        android_paddingBottom="10dp"
                        android_paddingLeft="5dp"
                        android_paddingRight="5dp"
                        android_paddingTop="10dp"
                        android_text="@string/side_wo_colon"
                        android_textColor="@color/white"
                        android_textSize="16sp" />

                    <LinearLayout
                        android_layout_width="1dp"
                        android_layout_height="match_parent" >

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

                    <TextView
                        android_id="@+id/textView14"
                        android_paddingBottom="10dp"
                        android_paddingLeft="5dp"
                        android_paddingRight="5dp"
                        android_paddingTop="10dp"
                        android_text="@string/total"
                        android_textColor="@color/white"
                        android_textSize="16sp" />
                </TableRow>

                <!-- display this button in 3rd column via layout_column(zero based) -->

                <TableRow
                    android_id="@+id/tableRow2"
                    android_layout_width="match_parent"
                    android_layout_height="match_parent"
                    android_background="#6F9C33" >

                    <TextView
                        android_id="@+id/textView21"
                        android_padding="5dp"
                        android_text="@string/servings"
                        android_textColor="@color/white"
                        android_textSize="16sp" />

                    <LinearLayout
                        android_layout_width="1dp"
                        android_layout_height="match_parent" >

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

    ..........
    .......
    ......

Miloš Černilovský

Deși soluția lui @CommonsWare funcționează, ea nu poate fi folosită de ex. layer-list drawable. Opțiunile care combină <rotate> și <shape> cauzează probleme cu dimensiunea. Iată o soluție care utilizează Android Vector Drawable. Acest Drawable este o linie albă de 1x10dp (poate fi ajustată prin modificarea parametrilor width, , height și strokeColor proprietăți):

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns_android="http://schemas.android.com/apk/res/android"
    android_viewportWidth="1"
    android_viewportHeight="10"
    android_width="1dp"
    android_height="10dp">

    <path
        android_strokeColor="#FFFFFF"
        android_strokeWidth="1"
        android_pathData="M0.5,0 V10" />

</vector> 

David Wasser

Pentru a realiza o linie verticală, este suficient să folosiți un dreptunghi cu lățimea de 1dp:

<shape>
    <size
        android_width="1dp"
        android_height="16dp" />
    <solid
        android_color="#c8cdd2" />
</shape>

Nu folosiți stroke, , utilizați solid (care este culoarea de „umplere”) pentru a specifica culoarea liniei.

sweet_vish

Se pare că există un bug atunci când se utilizează rotate drawable în Android M și mai sus, conform firului de discuție de aici : stackoverflow.com/a/8716798/3849039

După părerea mea, crearea unei vizualizări personalizate este cea mai bună soluție pentru acest lucru.

Linkul de mai jos îmi salvează timpul.

https://gist.github.com/mlagerberg/4aab34e6f8bc66b1eef7/revisions

Surender Kumar
 <View
        android_layout_width="2dp"
        android_layout_height="40dp"

        android_background="#ffffff"
        android_padding="10dp" />`