ligne verticale en utilisant XML drawable
-
27-09-2019 - |
Question
Je suis en train de comprendre comment définir à utiliser comme drawable une ligne verticale (1DP d'épaisseur).
Pour faire une horizontale, il est assez simple:
<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>
La question est, comment faire cette ligne verticale?
Oui, il existe des solutions de contournement, telles que l'élaboration d'une forme rectangulaire 1px épais, mais cela complique le XML étirable, si elle se compose de plusieurs éléments de <item>
.
Toute personne a eu une chance avec ça?
UPDATE
affaire est toujours sans solution. cependant, Pour toute personne dans une croisade de documentation Android - vous pourriez trouver ce utile: manquant XML Android Manuel
UPDATE
J'ai trouvé aucun autre moyen autre que celui que j'ai marqué comme correct. Il fait le tour mais se sent un peu « lourd », donc si vous connaissez la réponse n'oubliez pas de partager;)
La solution
Au lieu d'une forme, vous pouvez essayer un View
:
<View
android:layout_width="1dp"
android:layout_height="fill_parent"
android:background="#FF0000FF" />
Je ne l'ai utilisé cela pour des lignes horizontales, mais je pense que cela fonctionnerait pour les lignes verticales ainsi.
Utilisation:
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#FF0000FF" />
pour une ligne horizontale.
Autres conseils
Vous pouvez imbriquer votre forme dans une balise 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>
Cependant, le seul problème est la mise en page params définies dans votre mise en page XML seront les dimensions utilisées pour dessiner la forme originale. Signification si vous voulez que votre ligne soit 30dp grand, vous devez définir un layout_width de 30dp dans votre mise en page xml. Mais la largeur finale sera également 30dp dans ce cas, ce qui est probablement indésirable pour la plupart des situations. Cela signifie essentiellement la largeur et la hauteur doivent avoir la même valeur, la valeur de la longueur désirée pour la ligne. Je ne pouvais pas comprendre comment résoudre ce problème.
Cela semble être la solution « façon android », mais à moins qu'il ya une solution ou solution de contournement pour les dimensions question que je mentionne alors cela ne fonctionnera probablement pas pour la plupart des gens. Ce dont nous avons besoin est un attribut d'orientation en
Vous pouvez également référence à un autre drawable dans les attributs de la balise rotate, tels que:
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="90"
android:toDegrees="90"
android:drawable="@drawable/horizontal_line" />
Cependant, je n'ai pas testé et attendre d'avoir les mêmes problèmes.
- EDIT -
Oh, en fait je pensais à une solution. Vous pouvez utiliser une marge négative dans votre mise en page xml pour se débarrasser de l'espace supplémentaire indésirable. Tels que:
<ImageView
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_marginLeft="-15dp"
android:layout_marginRight="-15dp"
android:src="@drawable/dashed_vertical_line" />
<?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>
Le travail est pour moi. Mettre en arrière-plan de vue avec fill_parent ou de taille fixe en hauteur dp
Vous pouvez utiliser l'attribut 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>
Je suis venu avec une autre solution. L'idée est de remplir le drawable d'abord avec la couleur que vous aimez la ligne à remplir puis à nouveau toute la zone avec la couleur de fond tout en utilisant le rembourrage gauche ou à droite. Il est évident que cela ne fonctionne que pour une ligne verticale à l'extrême gauche ou à droite de votre drawable.
<?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>
Je pense que c'est la solution la plus simple:
<?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>
Je avais besoin d'ajouter dynamiquement / programme mon point de vue, afin d'ajouter une vue supplémentaire aurait été lourde. Ma taille de vue était WRAP_CONTENT, donc je ne pouvais pas utiliser la solution rectangle. J'ai trouvé un blog post ici sur extension TextView, remplaçant onDraw () et la peinture dans la ligne, donc je mis en œuvre que et il fonctionne bien. Voir mon code ci-dessous:
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);
}
}
Je besoin d'une ligne verticale sur la gauche, mais les paramètres sont DrawLine drawLine(startX, startY, stopX, stopY, paint)
de sorte que vous pouvez dessiner une ligne droite dans une direction à travers la vue.
Puis, dans mon activité je
NoteTextView note = new NoteTextView(this);
J'espère que cela t'aides.
son très simple ... d'ajouter une ligne verticale dans 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"/>
depends, où vous voulez avoir la ligne verticale, mais si vous voulez une bordure verticale par exemple, vous pouvez avoir la vue parent ont un arrière-plan un drawable personnalisé. Et vous pouvez alors définir la drawable comme ceci:
<?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>
Cet exemple va créer une ligne noire 1DP mince sur le côté droit de la vue, qui aura cette drawable comme arrière-plan.
Vous pouvez utiliser une forme, mais au lieu d'une marque de ligne ce rectangle.
android:shape="rectangle">
<stroke
android:width="5dp"
android:color="#ff000000"
android:dashGap="10px"
android:dashWidth="30px" />
et dans votre mise en page ce ...
<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"/>
Vous pourriez avoir à jouer avec la largeur, en fonction de la taille des tirets, pour l'obtenir en une seule ligne.
Hope this helps Vive
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>
..........
.......
......
<?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>
Pour une ligne verticale, il suffit d'utiliser un rectangle avec une largeur de 1DP:
<shape>
<size
android:width="1dp"
android:height="16dp" />
<solid
android:color="#c8cdd2" />
</shape>
Ne pas utiliser stroke
, l'utilisation solid
(ce qui est la couleur « de remplissage ») pour spécifier la couleur de la ligne.
On dirait que personne n'a mentionné cette option:
<?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>
<View
android:layout_width="2dp"
android:layout_height="40dp"
android:background="#ffffff"
android:padding="10dp" />`