ฉันจะวางเส้นขอบรอบ ๆ มุมมองข้อความของ Android ได้อย่างไร


719

เป็นไปได้ที่จะวาดเส้นขอบรอบ ๆ มุมมองข้อความหรือไม่?


ฉันโพสต์หนึ่งวิธีแก้ไขสกปรกที่นี่: stackoverflow.com/a/45242147/4291937
Gregor Ažbe

1
ตรวจสอบคำตอบหนึ่งซับของฉันด้านล่าง
Protean

คำตอบ:


1273

คุณสามารถตั้งค่ารูปร่างที่วาดได้ (สี่เหลี่ยมผืนผ้า) เป็นพื้นหลังสำหรับมุมมอง

<TextView android:text="Some text" android:background="@drawable/back"/>

และสี่เหลี่ยมผืนผ้า back.xml drawable สี่เหลี่ยมผืนผ้า (ใส่ลงในโฟลเดอร์ res / drawable):

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
   <solid android:color="@android:color/white" />
   <stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>

คุณสามารถใช้@android:color/transparentสีทึบเพื่อให้พื้นหลังโปร่งใส คุณยังสามารถใช้การขยายเพื่อแยกข้อความออกจากเส้นขอบ สำหรับข้อมูลเพิ่มเติมดูที่: http://developer.android.com/guide/topics/resources/drawable-resource.html


83
ถ้าฉันต้องการเส้นขอบด้านบนล่ะ
happyhardik

19
@whyoz วิธีการของเขาเพิ่มความซับซ้อนที่ไม่จำเป็นเพื่อดูลำดับชั้น คุณจะต้องใช้มุมมองเพิ่มเติมสองมุมมอง (คอนเทนเนอร์โครงร่างและมุมมองเส้นขอบ) เพื่อใช้วิธีการของเขา ดังนั้นหากคุณมีหลายมุมมองคุณจำเป็นต้องเพิ่มเส้นขอบให้กับทรีมุมมองของคุณจะไม่สามารถจัดการได้
Konstantin Burov

5
@whyoz ยังอาจใช้วิธีนี้ผ่านรูปแบบของธีมในขณะที่วิธีการของ YongGu ไม่สามารถใช้วิธีนี้ได้
Konstantin Burov

12
สำหรับเส้นขอบด้านบนเท่านั้นดูคำถามนี้
ปาง

7
คุณสามารถใช้เครื่องมือนี้http://shapes.softartstudio.comเพื่อสร้าง drawable
Arda Basoglu

186

ฉันขอสรุปวิธีที่ต่างกันสองสามวิธี (ไม่ใช่โปรแกรม)

ใช้รูปร่างที่วาดได้

บันทึกต่อไปนี้เป็นไฟล์ XML ในโฟลเดอร์ drawable ของคุณ (ตัวอย่างเช่น my_border.xml):

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

    <!-- View background color -->
    <solid
        android:color="@color/background_color" >
    </solid>

    <!-- View border color and width -->
    <stroke
        android:width="1dp"
        android:color="@color/border_color" >
    </stroke>

    <!-- The radius makes the corners rounded -->
    <corners
        android:radius="2dp"   >
    </corners>

</shape>

จากนั้นให้ตั้งเป็นพื้นหลังเป็น TextView ของคุณ:

<TextView
    android:id="@+id/textview1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/my_border" />

ความช่วยเหลือเพิ่มเติม:

การใช้ 9-patch

9-patch เป็นภาพพื้นหลังที่ยืดหยุ่นได้ หากคุณสร้างภาพด้วยเส้นขอบแล้วมันจะทำให้ TextView ของคุณเป็นเส้นขอบ สิ่งที่คุณต้องทำคือทำให้ภาพนั้นตั้งเป็นพื้นหลังใน TextView ของคุณ

<TextView
    android:id="@+id/textview1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/my_ninepatch_image" />

นี่คือลิงค์บางส่วนที่จะแสดงวิธีสร้างอิมเมจ 9 แพทช์:

ถ้าฉันต้องการเส้นขอบด้านบนล่ะ

การใช้รายการเลเยอร์

คุณสามารถใช้รายการเลเยอร์เพื่อสแต็กสี่เหลี่ยมสองรูปที่ด้านบนของกันและกัน โดยการทำให้สี่เหลี่ยมที่สองมีขนาดเล็กกว่าสี่เหลี่ยมแรกเล็กน้อยคุณสามารถสร้างเอฟเฟกต์เส้นขอบได้ สี่เหลี่ยมผืนผ้าแรก (ต่ำกว่า) คือสีเส้นขอบและสี่เหลี่ยมที่สองคือสีพื้นหลัง

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

    <!-- Lower rectangle (border color) -->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/border_color" />
        </shape>
    </item>

    <!-- Upper rectangle (background color) -->
    <item android:top="2dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/background_color" />
        </shape>
    </item>
</layer-list>

การตั้งค่าandroid:top="2dp"ออฟเซ็ตสูงสุด สิ่งนี้อนุญาตให้สี่เหลี่ยมผืนผ้าแรก (ล่าง) แสดงผ่านทำให้เกิดเอฟเฟกต์เส้นขอบ คุณสามารถใช้สิ่งนี้กับพื้นหลัง TextView ในลักษณะเดียวกับที่shapeวาดได้เสร็จสิ้นด้านบน

นี่คือลิงค์เพิ่มเติมเกี่ยวกับรายการเลเยอร์:

การใช้ 9-patch

คุณสามารถสร้างอิมเมจ 9 แพตช์ที่มีเส้นขอบเดียว ทุกอย่างอื่นเหมือนกันตามที่กล่าวไว้ข้างต้น

ใช้มุมมอง

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

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

    <TextView
        android:id="@+id/textview1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <!-- This adds a border between the TextViews -->
    <View
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@android:color/black" />

    <TextView
        android:id="@+id/textview2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

นี่คือลิงค์เพิ่มเติม:


24
คน Jeez ที่border: 1px solid #999;ไม่ควรจะได้รับการนี้ซับซ้อน
Achshar

จะทำอย่างไรถ้าฉันต้องการเส้นขอบของมุมมองข้อความซึ่งมีเงาและระลอกคลื่นด้วย
Akash Dubey

@AkashDubey ขอโทษฉันยังไม่เคยทำมาก่อน ฉันแนะนำให้คุณลองแต่ละอันแยกกันแล้วรวมเข้าด้วยกัน หากคุณติดขัดให้ถามคำถามใหม่เกี่ยวกับ Stack Overflow
Suragch

49

วิธีง่ายๆคือการเพิ่มมุมมองสำหรับ TextView ของคุณ ตัวอย่างสำหรับเส้นขอบด้านล่าง:

<LinearLayout android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent">
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:text="@string/title"
        android:id="@+id/title_label"
        android:gravity="center_vertical"/>
    <View
        android:layout_width="fill_parent"
        android:layout_height="0.2dp"
        android:id="@+id/separator"
        android:visibility="visible"
        android:background="@android:color/darker_gray"/>

</LinearLayout>

สำหรับเส้นขอบทิศทางอื่นโปรดปรับตำแหน่งของมุมมองตัวคั่น


3
สำหรับประสบการณ์ของฉันโซลูชันนี้บนอุปกรณ์เก่ามีผลกระทบต่อการทำงานของแอพ
Roberto Lombardini

43
นี่เป็นทางออกที่น่ากลัวจากมุมมองเงินเฟ้อ คุณสร้างองค์ประกอบมุมมองใหม่ 3 องค์ประกอบและเพิ่มอีกหนึ่งระดับในระดับความลึกของมุมมอง
philipp

ทางออกที่เลวร้ายที่สุดเพราะมุมมองเงินเฟ้อที่ฟิลิปได้กล่าวไว้ คุณรู้หรือไม่ว่า textView มีแท็ก xml เฉพาะที่จะทำเช่นนั้น: กำหนดรูปภาพที่จะวาดซ้าย / ขวา / บน / ล่างทำให้ TextView ของคุณปรากฏขึ้นและพวกเขารู้จักกันในชื่อ android: drawable ****
Mathias Seguy Android2ee

32

ฉันได้แก้ไขปัญหานี้โดยขยายมุมมองข้อความและวาดเส้นขอบด้วยตนเอง ฉันยังได้เพิ่มเพื่อให้คุณสามารถเลือกได้ว่าเส้นประมีเส้นประหรือเส้นประ

public class BorderedTextView extends TextView {
        private Paint paint = new Paint();
        public static final int BORDER_TOP = 0x00000001;
        public static final int BORDER_RIGHT = 0x00000002;
        public static final int BORDER_BOTTOM = 0x00000004;
        public static final int BORDER_LEFT = 0x00000008;

        private Border[] borders;

        public BorderedTextView(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);
            init();
        }

        public BorderedTextView(Context context, AttributeSet attrs) {
            super(context, attrs);
            init();
        }

        public BorderedTextView(Context context) {
            super(context);
            init();
        }
        private void init(){
            paint.setStyle(Paint.Style.STROKE);
            paint.setColor(Color.BLACK);
            paint.setStrokeWidth(4);        
        }
        @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);
            if(borders == null) return;

            for(Border border : borders){
                paint.setColor(border.getColor());
                paint.setStrokeWidth(border.getWidth());

                if(border.getStyle() == BORDER_TOP){
                    canvas.drawLine(0, 0, getWidth(), 0, paint);                
                } else
                if(border.getStyle() == BORDER_RIGHT){
                    canvas.drawLine(getWidth(), 0, getWidth(), getHeight(), paint);
                } else
                if(border.getStyle() == BORDER_BOTTOM){
                    canvas.drawLine(0, getHeight(), getWidth(), getHeight(), paint);
                } else
                if(border.getStyle() == BORDER_LEFT){
                    canvas.drawLine(0, 0, 0, getHeight(), paint);
                }
            }
        }

        public Border[] getBorders() {
            return borders;
        }

        public void setBorders(Border[] borders) {
            this.borders = borders;
        }
}

และระดับชายแดน:

public class Border {
    private int orientation;
    private int width;
    private int color = Color.BLACK;
    private int style;
    public int getWidth() {
        return width;
    }
    public void setWidth(int width) {
        this.width = width;
    }
    public int getColor() {
        return color;
    }
    public void setColor(int color) {
        this.color = color;
    }
    public int getStyle() {
        return style;
    }
    public void setStyle(int style) {
        this.style = style;
    }
    public int getOrientation() {
        return orientation;
    }
    public void setOrientation(int orientation) {
        this.orientation = orientation;
    }
    public Border(int Style) {
        this.style = Style;
    }
}

หวังว่าจะช่วยให้ใครบางคน :)


วิธีการเริ่มต้นเส้นขอบ?
zionpi

ทำงานไม่ถูกต้องเนื่องจากรหัสแสดงให้เห็นว่าวาดเส้นขอบตามขนาดครึ่งหนึ่งของค่าที่กำหนด
ucMedia

14

ฉันแค่ดูคำตอบที่คล้ายกัน - สามารถทำได้ด้วย Stroke และการแทนที่ต่อไปนี้:

@Override
public void draw(Canvas canvas, MapView mapView, boolean shadow) {

Paint strokePaint = new Paint();
strokePaint.setARGB(255, 0, 0, 0);
strokePaint.setTextAlign(Paint.Align.CENTER);
strokePaint.setTextSize(16);
strokePaint.setTypeface(Typeface.DEFAULT_BOLD);
strokePaint.setStyle(Paint.Style.STROKE);
strokePaint.setStrokeWidth(2);

Paint textPaint = new Paint();
textPaint.setARGB(255, 255, 255, 255);
textPaint.setTextAlign(Paint.Align.CENTER);
textPaint.setTextSize(16);
textPaint.setTypeface(Typeface.DEFAULT_BOLD);

canvas.drawText("Some Text", 100, 100, strokePaint);
canvas.drawText("Some Text", 100, 100, textPaint);

super.draw(canvas, mapView, shadow); 
}

ที่ดี! ข้อกังวลเดียวของฉันคือจังหวะที่น่าเกลียดเมื่อฉันใช้ drawRoundRect ทั้งในโทรศัพท์และในโปรแกรมจำลอง
erdomester

1
@erdomester อาจจะทาสี StrokePaint = ทาสีใหม่ (Paint.ANTI_ALIAS_FLAG) จะแก้ปัญหา "น่าเกลียดที่มุม"
P-RAD

14

คุณสามารถกำหนดเส้นขอบได้สองวิธี หนึ่งคือโดย drawable และที่สองคือการเขียนโปรแกรม

ใช้ Drawable

<shape>
    <solid android:color="@color/txt_white"/>
    <stroke android:width="1dip" android:color="@color/border_gray"/>
    <corners android:bottomLeftRadius="10dp"
             android:bottomRightRadius="0dp"
             android:topLeftRadius="10dp"
             android:topRightRadius="0dp"/>
    <padding android:bottom="0dip"
             android:left="0dip"
             android:right="0dip"
             android:top="0dip"/>
</shape>

การเขียนโปรแกรม


public static GradientDrawable backgroundWithoutBorder(int color) {

    GradientDrawable gdDefault = new GradientDrawable();
    gdDefault.setColor(color);
    gdDefault.setCornerRadii(new float[] { radius, radius, 0, 0, 0, 0,
                                           radius, radius });
    return gdDefault;
}

รูปร่าง XML นั้นเกี่ยวข้องกับ textView อย่างไร
Neo42

14

วิธีที่ง่ายที่สุดที่ฉันพบ (และใช้งานได้จริง):

<TextView
    ...
    android:background="@android:drawable/editbox_background" />

เป็นไปได้หรือไม่ที่จะใช้สิ่งนี้กับการดูตัวอย่างทั้งหมดจากที่เดียว?
Ian Warburton

เหมาะสำหรับกุ๊กกิ๊ก แต่ขึ้นอยู่กับรุ่นของอุปกรณ์ที่ใช้งานสิ่งนี้อาจมีผลกระทบที่ผิดปกติมาก เป็นเพราะ Google ยังคงเปลี่ยนแปลงวิธี EditTexts ดู (คุณต้องเก็บไว้ในแฟชั่น!)
สกอตต์บิ๊กส์

11

ฉันพบวิธีที่ดีกว่าในการวางเส้นขอบรอบ TextView

ใช้อิมเมจเก้าแพทช์สำหรับพื้นหลัง มันง่ายสวย SDK ที่มาพร้อมกับเครื่องมือที่จะทำให้ภาพที่ 9 แพทช์และมันเกี่ยวข้องอย่างไม่มีการเข้ารหัส

การเชื่อมโยงเป็นhttp://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch


2
มีประโยชน์ใช่ แต่จะดีกว่านี้ได้อย่างไร
รวม

2
การใช้รูปร่างตามคำตอบที่ยอมรับนั้นดีกว่า 9-patch ไฟล์ XML นั้นมีความยืดหยุ่นมากกว่าเนื้อหากราฟิก
Jose_GD

แน่นอนว่าหากคุณต้องการ จำกัด การสร้างกราฟิกที่คุณต้องการโดยทางโปรแกรมแสดงว่ามีความยืดหยุ่นมากกว่า
Nick

2
รูปร่าง - ไร้ประโยชน์บางทีฉันเป็นเพียงคนเดียวที่ประสบแท็ก "ทึบ" จะถูกประมวลผลเสมอไม่ว่าจะตั้งค่าเป็นแบบโปร่งใสหรือไม่และถ้าฉันต้องการสร้างเส้นขอบฉันหมายถึงเส้นขอบและไม่ใช่ สี่เหลี่ยมผืนผ้าที่มีเส้นขอบสีภายในและสีอื่น ๆ และไม่เคยเป็นของแข็งโปร่งใส มันมักจะรบกวนสี นอกจากนี้คลาสที่สืบทอดจากอีกอันหนึ่งก็ควรมีคุณสมบัติทั้งหมดด้วยเช่นกันเพราะมันสืบทอดมา ไม่เข้าใจจริงๆว่าทำไม android-OO-design-Guidelines ถึงขาด ตัวอย่างเช่นฉันสืบทอดมาจากปุ่ม คุณสมบัติทั้งหมดหายไป ทำไม
icbytes

2
@ Jeremie ช้าลงอย่างเห็นได้ชัด? คุณสังเกตได้อย่างไร
IgorGanapolsky

11

คุณสามารถเพิ่มสิ่งนี้ในรหัสของคุณ:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle" >
    <solid android:color="#ffffff" />
    <stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>

เหตุใดจึงจำเป็นจังหวะ
IgorGanapolsky

@IgorGanapolsky, โรคหลอดเลือดสมองสร้างเส้นขอบที่แท้จริง?
Tash Pemhiwa

10

ตรวจสอบลิงค์ด้านล่างเพื่อทำมุมมน http://androidcookbook.com/Recipe.seam?recipeId=2318

โฟลเดอร์ drawable ภายใต้ res ในโครงการ Android ไม่ได้ จำกัด อยู่ที่บิตแมป (ไฟล์ PNG หรือ JPG) แต่สามารถเก็บรูปร่างที่กำหนดไว้ในไฟล์ XML ได้

รูปร่างเหล่านี้สามารถนำกลับมาใช้ใหม่ในโครงการ รูปร่างสามารถใช้เพื่อวางเส้นขอบรอบเค้าโครง ตัวอย่างนี้แสดงเส้นขอบรูปสี่เหลี่ยมผืนผ้าที่มีมุมโค้ง ไฟล์ใหม่ที่ชื่อว่า customborder.xml ถูกสร้างขึ้นในโฟลเดอร์ drawable (ใน Eclipse ใช้เมนูไฟล์และเลือกใหม่แล้วตามด้วยไฟล์ที่เลือกโฟลเดอร์ drawable ได้ในชื่อไฟล์แล้วคลิกเสร็จสิ้น)

XML ที่กำหนดรูปร่างชายแดนถูกป้อน:

<?xml version="1.0" encoding="UTF-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <corners android:radius="20dp"/>
    <padding android:left="10dp" android:right="10dp" android:top="10dp" android:bottom="10dp"/>
    <solid android:color="#CCCCCC"/>
</shape>

แอ็ตทริบิวต์android:shapeถูกตั้งค่าเป็นรูปสี่เหลี่ยมผืนผ้า (ไฟล์รูปร่างยังรองรับวงรีเส้นและวงแหวน) Rectangle เป็นค่าเริ่มต้นดังนั้นแอตทริบิวต์นี้อาจถูกปล่อยทิ้งไว้หากเป็นสี่เหลี่ยมผืนผ้าที่กำหนดไว้ ดูเอกสารประกอบ Android เกี่ยวกับรูปร่างที่http://developer.android.com/guide/topics/resources/drawable-resource.html#Shapeสำหรับข้อมูลรายละเอียดเกี่ยวกับไฟล์รูปร่าง

มุมองค์ประกอบกำหนดมุมสี่เหลี่ยมที่จะถูกปัดเศษ เป็นไปได้ที่จะตั้งค่ารัศมีที่แตกต่างกันในแต่ละมุม (ดูข้อมูลอ้างอิง Android)

แอ็ตทริบิวต์ padding ใช้เพื่อย้ายเนื้อหาของมุมมองที่ใช้กับรูปร่างเพื่อป้องกันเนื้อหาซ้อนทับเส้นขอบ

สีเส้นขอบที่นี่ถูกตั้งค่าเป็นสีเทาอ่อน (ค่า RGB เลขฐานสิบหก CCCCCC)

รูปร่างสนับสนุนการไล่ระดับสี แต่ไม่ได้ใช้ที่นี่ ดูทรัพยากร Android อีกครั้งเพื่อดูว่าการไล่ระดับสีถูกกำหนดไว้อย่างไร รูปร่างถูกนำไปใช้ laypout android:background="@drawable/customborder"โดยใช้

ภายในเลย์เอาต์มุมมองอื่น ๆ สามารถเพิ่มได้ตามปกติ ในตัวอย่างนี้เพิ่ม TextView เดียวและข้อความเป็นสีขาว (FFFFFF ฐานสิบหก RGB) พื้นหลังถูกตั้งค่าเป็นสีน้ำเงินบวกกับความโปร่งใสบางอย่างเพื่อลดความสว่าง (ค่า RGB เลขฐานสิบหก A00000FF ฐานสิบหก) ในที่สุดโครงร่างจะถูกชดเชยจากขอบหน้าจอโดยวางลงในเค้าโครงอื่นด้วยการใส่จำนวนเล็กน้อย ไฟล์เค้าโครงทั้งหมดจึง:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
              android:padding="5dp">
    <LinearLayout android:orientation="vertical"
                  android:layout_width="fill_parent"
                  android:layout_height="fill_parent"
                  android:background="@drawable/customborder">
        <TextView android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:text="Text View"
                android:textSize="20dp"
                android:textColor="#FFFFFF"
                android:gravity="center_horizontal"
                android:background="#A00000FF" />
    </LinearLayout>
</LinearLayout>

คำตอบของลิงก์เท่านั้นเป็นสิ่งที่ท้อแท้อย่างมากเนื่องจากลิงก์มักจะแตกหักในบางจุดในอนาคต ดึงส่วนที่เกี่ยวข้องของลิงก์ของคุณลงในคำตอบนี้เพื่อให้ข้อมูลยังคงมีอยู่แม้ว่าลิงก์จะไม่มี
Andy

8

ฉันมีวิธีที่จะทำอย่างง่าย ๆ และฉันต้องการแบ่งปัน

เมื่อฉันต้องการตารางไมล์ TextViews ฉันเพิ่งวางไว้ใน LinearLayout ฉันตั้งค่าสีพื้นหลังของ LinearLayout ของฉันและฉันเพิ่มระยะขอบให้กับ TextView ของฉัน ผลลัพธ์ที่ได้จะเหมือนกับว่าคุณยกกำลังสองของ TextView


2

การเปลี่ยนคำตอบของ Konstantin Burov เพราะไม่ทำงานในกรณีของฉัน:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white" />
            <stroke android:width="2dip" android:color="#4fa5d5"/>
            <corners android:radius="7dp"/>
        </shape>
    </item>
</selector>

compileSdkVersion 26 (Android 8.0), minSdkVersion 21 (Android 5.0), targetSdkVersion 26, การนำไปใช้ 'com.android.support :appcompat-v7:26.1.0', ระดับ: 4.1


2

คุณสามารถสร้างพื้นหลังที่กำหนดเองสำหรับมุมมองข้อความของคุณ ขั้นตอน 1. ไปที่โครงการของคุณ 2. ไปที่ทรัพยากรและคลิกขวาเพื่อวาดได้ 3. คลิกที่ใหม่ -> ไฟล์ทรัพยากร Drawable 4. ตั้งชื่อไฟล์ 5. วางรหัสต่อไปนี้ในไฟล์

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="1dp" android:color="@color/colorBlack" />
<padding android:left="1dp"
    android:top="1dp"
    android:right="1dp"
    android:bottom="1dp" />
<corners android:radius="6dp" />
<solid android:color="#ffffffff" />

  1. สำหรับมุมมองข้อความของคุณที่คุณต้องการใช้เป็นแบ็คกราวด์

    หุ่นยนต์: พื้นหลัง = "@ drawable / your_fileName"


1

นี่คือคลาสตัวช่วย 'เรียบง่าย' ของฉันซึ่งส่งคืน ImageView ด้วยเส้นขอบ เพียงแค่วางลงในโฟลเดอร์ utils ของคุณและเรียกมันว่าสิ่งนี้

ImageView selectionBorder = BorderDrawer.generateBorderImageView(context, borderWidth, borderHeight, thickness, Color.Blue);

นี่คือรหัส

/**
 * Because creating a border is Rocket Science in Android.
 */
public class BorderDrawer
{
    public static ImageView generateBorderImageView(Context context, int borderWidth, int borderHeight, int borderThickness, int color)
    {
        ImageView mask = new ImageView(context);

        // Create the square to serve as the mask
        Bitmap squareMask = Bitmap.createBitmap(borderWidth - (borderThickness*2), borderHeight - (borderThickness*2), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(squareMask);

        Paint paint = new Paint();
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(color);
        canvas.drawRect(0.0f, 0.0f, (float)borderWidth, (float)borderHeight, paint);

        // Create the darkness bitmap
        Bitmap solidColor = Bitmap.createBitmap(borderWidth, borderHeight, Bitmap.Config.ARGB_8888);
        canvas = new Canvas(solidColor);

        paint.setStyle(Paint.Style.FILL);
        paint.setColor(color);
        canvas.drawRect(0.0f, 0.0f, borderWidth, borderHeight, paint);

        // Create the masked version of the darknessView
        Bitmap borderBitmap = Bitmap.createBitmap(borderWidth, borderHeight, Bitmap.Config.ARGB_8888);
        canvas = new Canvas(borderBitmap);

        Paint clearPaint = new Paint();
        clearPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

        canvas.drawBitmap(solidColor, 0, 0, null);
        canvas.drawBitmap(squareMask, borderThickness, borderThickness, clearPaint);

        clearPaint.setXfermode(null);

        ImageView borderView = new ImageView(context);
        borderView.setImageBitmap(borderBitmap);

        return borderView;
    }
}

ฉันจะใช้งานselectionBorderอย่างไร
Tash Pemhiwa

@TashPemhiwa Button.setBackgroundDrawable ();
NinjaOnSafari

0

สิ่งนี้อาจช่วยคุณได้

<RelativeLayout
    android:id="@+id/textbox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:background="@android:color/darker_gray" >

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_margin="3dp"
        android:background="@android:color/white"
        android:gravity="center"
        android:text="@string/app_name"
        android:textSize="20dp" />

</RelativeLayout

0

สร้างมุมมองชายแดนด้วยสีพื้นหลังเป็นสีของเส้นขอบและขนาดของมุมมองข้อความของคุณ กำหนดช่องว่างภายในดูเป็นความกว้างของเส้นขอบ ตั้งค่าสีพื้นหลังของมุมมองข้อความเป็นสีที่คุณต้องการสำหรับมุมมองข้อความ ตอนนี้เพิ่มมุมมองข้อความของคุณภายในมุมมองชายแดน



0

มีหลายวิธีในการเพิ่มเส้นขอบให้กับ textView สิ่งที่ง่ายที่สุดคือการสร้าง drawable แบบกำหนดเองและตั้งเป็น android:background="@drawable/textview_bg" textView ของคุณ

textview_bg.xml จะอยู่ภายใต้ Drawables และอาจเป็นดังนี้ คุณสามารถมีsolidหรือเป็นgradientพื้นหลัง (หรือไม่มีอะไรก็ได้หากไม่ต้องการ) cornersเพื่อเพิ่มรัศมีมุมและstrokeเพื่อเพิ่มเส้นขอบ

textview_bg.xml

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

        <corners
            android:radius="@dimen/dp_10"/>

        <gradient
            android:angle="225"
            android:endColor="#FFFFFF"
            android:startColor="#E0E0E0" />

        <stroke
            android:width="2dp"
            android:color="#000000"/>

    </shape>

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

รหัสนี้เพียงพอที่คุณสามารถวางได้ทุกที่ที่คุณต้องการ


0

setBackground ในมุมมองข้อความ xml ของคุณ

เพิ่มไฟล์ round_textview.xml ลงในไดเรกทอรี drawable ของคุณ

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
   <solid android:color="@android:color/white" />
   <stroke android:width="2dip" android:color="#4f5g52"/>
</shape>

ตั้งไฟล์ drawable ในพื้นหลัง textView


-1

จริงๆแล้วมันง่ายมาก หากคุณต้องการสี่เหลี่ยมผืนผ้าสีดำด้านหลัง Textview เพียงเพิ่มandroid:background="@android:color/black"ในแท็ก TextView แบบนี้:

<TextView
    android:textSize="15pt" android:textColor="#ffa7ff04"
    android:layout_alignBottom="@+id/webView1"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:background="@android:color/black"/>

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