使用XML可繪製的垂直線

120

我想弄清楚如何定義一個垂直線（1dp厚）作爲drawable使用。使用XML可繪製的垂直線

要進行水平之一，這是非常簡單的：

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

的問題是，如何讓這條線垂直？

是的，有一些解決方法，比如繪製一個1px厚的矩形形狀，但是如果它包含多個<item>元素，則會使可繪製的XML複雜化。

任何人有這個機會嗎？

UPDATE

案例仍然沒有解決。然而，有關在Android文檔討伐的人 - 你可能會發現這個有用： Missing Android XML Manual

UPDATE

我發現比我標記爲正確的一個沒有其它的辦法。它做的伎倆，雖然感覺有點「重」，因此，如果您知道答案，不要忘記分享;）

來源

2010-04-17 Kaspa

319

相反的形狀，你可以嘗試View：

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

我只用這個水平線，但我認爲它也適用於垂直線。

用途：

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

爲一條水平線。

來源

2010-04-17 16:08:41 CommonsWare

謝謝Mark :)！我知道我可以使用視圖來實現這一點。事情是我正在組裝一個更復雜的視圖，我想用作表格單元格背景的可繪圖。那裏有不同類型的形狀/漸變/線條。使用視圖將是一個解決方案，但是我將不得不把它放在一個不同的繪圖「層」，這可能會在拍攝自己的腳時遇到大小調整等。我想知道爲什麼沒有文檔「形狀」xmls，也許有人從谷歌可以啓發我們？ :) – Kaspa 2010-04-17 17:14:49

使用marginRight/Start和Left/End有時候在兩側獲得空間也很有趣。 – George 2017-10-02 22:08:35

你可以將你的形狀嵌套在一個旋轉標籤內。

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

但是，唯一的問題是在佈局中定義的佈局參數xml將用於繪製原始形狀的尺寸。意思是如果你想讓你的線條達到30dp高，你需要在你的佈局xml中定義一個30dp的layout_width。但在這種情況下，最終寬度也將爲30dp，這在大多數情況下可能不合需要。這基本上意味着寬度和高度都必須是相同的值，即所需長度的值。我無法弄清楚如何解決這個問題。

這似乎是「android方式」解決方案，但除非我提到的維度問題有一些修復或解決方法，否則這可能不適用於大多數人。我們真正需要的是< shape/>或< stroke/>中的方向屬性。

您也可以嘗試引用了旋轉標籤的屬性另一繪製，如：

<rotate xmlns:android="http://schemas.android.com/apk/res/android" 
    android:fromDegrees="90" 
    android:toDegrees="90" 
    android:drawable="@drawable/horizontal_line" />

但是我沒有測試過這一點，並希望它有同樣的問題。

- 編輯 -

哦，我居然想出了一個修補程序。您可以在佈局xml中使用負邊距來消除不需要的額外空間。如：

<ImageView 
    android:layout_width="35dp" 
    android:layout_height="35dp" 
    android:layout_marginLeft="-15dp" 
    android:layout_marginRight="-15dp" 
    android:src="@drawable/dashed_vertical_line" />

來源

2010-09-22 20:56:44 cephus

，而負邊距將適用於99％的設備....只是知道，有設備在那裏將強制關閉，如果你這樣做。有些設備有可能導致消極的利潤膨脹 – 2012-11-30 04:44:38

@cephus我使用你的第一個代碼，但我需要在視圖頂部的行。這是我認爲的中心。我如何設置它的重力（在形狀XML文件中）？ – Behzad 2013-01-10 19:22:44

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

工作的我。把它作爲fill_parent的視圖背景或固定大小的dp高度

來源

2012-09-08 12:43:31 logcat

我需要動態/以編程方式添加我的視圖，因此添加額外的視圖會非常麻煩。我的視圖高度是WRAP_CONTENT，所以我不能使用矩形解決方案。我發現了一篇關於擴展TextView，覆蓋onDraw（）和繪畫的博客文章here，所以我實現了它，並且它運行良好。見下面我的代碼：

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); 
    } 
}

我需要在左邊一條垂直線，但DrawLine的參數是drawLine(startX, startY, stopX, stopY, paint)這樣你就可以得出任何直線穿過視圖中的任何方向。然後在我的活動中，我有 NoteTextView note = new NoteTextView(this); 希望這會有所幫助。

來源

2013-01-21 13:24:25 willlma

我想出了一個不同的解決方案。這個想法是先用你喜歡的顏色填充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>

來源

2013-06-27 15:13:57

我需要在左側，右側，底部有邊框的背景，這對我有用，謝謝！ – 2013-08-02 10:02:15

太棒了，用這個我設法在我的LinearLayout（'showDividers =「middle」'）中創建了整齊的分隔線。爲了得到一個2dp分頻器，我需要在這裏指定'android：left =「3dp」'。 – Jonik 2013-12-30 10:14:16

提示：爲了使這個drawable更通用，使用'@android：color/transparent'而不是'@ color/background_color'硬編碼。 – Jonik 2013-12-30 10:16:02

您可以使用一個形狀，而不是一條線使它成矩形。

android:shape="rectangle"> 
<stroke 
    android:width="5dp" 
    android:color="#ff000000" 
    android:dashGap="10px" 
    android:dashWidth="30px" />

，並在您的佈局中使用這個......

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

你可能有寬度的發揮，取決於破折號的大小，把它變成一個單一的線。

希望這有助於乾杯

來源

2013-11-06 10:23:55 Boxlady

它很簡單...... 添加在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"/>

來源

2013-12-23 15:54:37 user3130068

這很有用，當你可以'因爲父高度設置爲wrap_content，所以請使用fill_parent作爲高度。 – 2014-11-15 19:53:28

取決於您希望有垂直線，但例如，如果你想要一個垂直邊框，你可以讓父視圖有一個自定義可繪製的背景。然後你可以定義繪製這樣的：

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

這個例子將創建視圖的右側1DP細黑線，這將有這樣的繪製作爲背景。

來源

2014-05-07 09:31:10 Lukas1

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> 

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

來源

2014-05-15 13:00:56 YasirAzgar

-2

非常簡單，我認爲更好的方法。

<TextView 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceMedium" 
      android:text="Section Text" 
      android:id="@+id/textView6" 
      android:textColor="@color/emphasis" 
      android:drawableBottom="@drawable/underline"/>

下劃線。XML

<?xml version="1.0" encoding="utf-8"?> 
<shape 
     xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle"> 
     <size android:width="1000dp" android:height="2dp" /> 
     <solid android:color="@color/emphasis"/> 
</shape>

來源

2014-11-18 05:27:21

這是一條水平線，而不是一條垂直線。 – 2015-02-15 20:20:13

另外，不需要android：width =「1000dp」。只是把它留下。 – 2015-03-08 10:49:32

-1

<View 
     android:layout_width="2dp" 
     android:layout_height="40dp" 

     android:background="#ffffff" 
     android:padding="10dp" />`

來源

2015-01-12 08:46:31

您可以使用旋轉屬性

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

來源

2015-03-17 06:00:57 user4679242

請多說明一下爲什麼這是一個更好的答案... – fijas 2015-03-17 06:20:43

這絕對是一個更好的（或最好的）答案，因爲@ @ commonsware的回答就足夠了正常的垂直線。如果我們不想創建虛線（比如說），這是唯一可以正常工作的答案。 – 2015-08-25 04:43:06

要進行垂直線，只使用一個長方形的寬度1DP：

<shape> 
    <size 
     android:width="1dp" 
     android:height="16dp" /> 
    <solid 
     android:color="#c8cdd2" /> 
</shape>

不要使用stroke，使用solid（這是「填充」顏色）來指定線的顏色。

來源

2017-11-08 17:28:40

使用XML可繪製的垂直線

回答

相關問題