วิธีทำให้พื้นหลังโปร่งใส 20% บน Android


619

ฉันจะทำให้พื้นหลังมีTextviewความโปร่งใสประมาณ 20% (ไม่โปร่งใสอย่างสมบูรณ์) ได้อย่างไรซึ่งมีสีในพื้นหลัง (เช่นสีขาว)


คำตอบ:


1038

ทำให้สีมี 80% ในช่องอัลฟา ตัวอย่างเช่นสำหรับการใช้งานสีแดง#CCFF0000:

<TextView
   ...
   android:background="#CCFF0000" />

ในตัวอย่างเป็นจำนวนฐานสิบหกสำหรับCC 255 * 0.8 = 204โปรดทราบว่าตัวเลขฐานสิบหกสองหลักแรกใช้สำหรับช่องอัลฟา รูปแบบคือ#AARRGGBBที่ใดAAคือช่องอัลฟาRRคือช่องสีแดงGGเป็นช่องสีเขียวและBBเป็นช่องสีน้ำเงิน

ฉันสมมติว่าโปร่งใส 20% หมายถึงทึบแสง 80% ถ้าคุณหมายถึงวิธีอื่น ๆ แทนการCCใช้งานซึ่งเป็นฐานสิบหกสำหรับ33255 * 0.2 = 51

ในการคำนวณค่าที่เหมาะสมสำหรับค่าอัลฟาโปร่งใสคุณสามารถทำตามขั้นตอนนี้:

  1. เมื่อกำหนดเปอร์เซ็นต์ความโปร่งใสเช่น 20% คุณจะรู้ว่าค่าเปอร์เซ็นต์ทึบแสงคือ 80% (นี่คือ100-20=80)
  2. ช่วงสำหรับช่องสัญญาณอัลฟ่าคือ 8 บิต ( 2^8=256) หมายถึงช่วงเริ่มจาก 0 ถึง 255
  3. ฉายเปอร์เซ็นต์ทึบแสงลงในช่วงอัลฟากล่าวคือคูณช่วง (255) ด้วยเปอร์เซ็นต์ ในตัวอย่าง255 * 0.8 = 204นี้ ปัดเศษเป็นจำนวนเต็มที่ใกล้ที่สุดถ้าต้องการ
  4. แปลงค่าที่ได้รับใน 3 ซึ่งอยู่ในฐาน 10 เป็นฐานสิบหก (ฐาน 16) คุณสามารถใช้ Google สำหรับเครื่องคิดเลขนี้หรือเครื่องใดก็ได้ เมื่อใช้ Google ให้พิมพ์ "204 ถึง hexa" และจะให้ค่าเลขฐานสิบหกแก่คุณ 0xCCในกรณีนี้มันเป็น
  5. เติมค่าที่ได้รับใน 4 เป็นสีที่ต้องการ ตัวอย่างเช่นสำหรับสีแดงซึ่งเป็นคุณจะมีFF0000CCFF0000

คุณสามารถดูเอกสารเกี่ยวกับสีของ Androidได้


สำหรับสีขาวandroid:background="#CCFFFFFF"สีด้วยความโปร่งใสตามคำถามที่ใช้
gotwo

วิธีการใช้กฎนี้สำหรับพื้นหลังที่มีภาพ?
user1090751

1517

ใช้รหัสด้านล่างสำหรับสีดำ:

<color name="black">#000000</color>

ตอนนี้ถ้าฉันต้องการใช้ความทึบคุณสามารถใช้รหัสด้านล่าง:

 <color name="black">#99000000</color> <!-- 99 is for alpha and others pairs zero's are for R G B -->

และด้านล่างสำหรับรหัสความทึบ: และระดับความทึบทั้งหมดที่นี่

ค่าความทึบแสงฐานสิบหก

100%  FF
95%  F2
90%  E6
85%  D9
80%  CC
75%  BF
70%  B3
65%  A6
60%  99
55%  8C
50%  80
45%  73
40%  66
35%  59
30%  4D
25%  40
20%  33
15%  26
10%  1A
5%  0D
0%  00

หากคุณลืมรหัสใด ๆ เพื่อความโปร่งใสคุณจะต้องเห็นลิงค์ด้านล่างและไม่ต้องกังวลเกี่ยวกับการจดจำสิ่งต่าง ๆ เกี่ยวกับรหัสโปร่งใส: -

https://github.com/duggu-hcd/TransparentColorCode

textviewHeader.setTextColor(Color.parseColor(ColorTransparentUtils.transparentColor(R.color.border_color,10)));

3
เมื่อเห็นสิ่งนี้ฉันใช้ # 99ffffff และใช้งานได้ดีสำหรับฉันขอบคุณ
nawaab saab

วิธีการใช้กฎนี้สำหรับพื้นหลังที่มีภาพ?
user1090751

149

คุณสามารถจัดการความทึบของสีที่เปลี่ยนแปลงตัวอักษร 2 ตัวแรกในคำจำกัดความสี:

# 99 000000

100%  FF
99%  FC
98%  FA
97%  F7
96%  F5
95%  F2
94%  F0
93%  ED
92%  EB
91%  E8

90%  E6
89%  E3
88%  E0
87%  DE
86%  DB
85%  D9
84%  D6
83%  D4
82%  D1
81%  CF

80%  CC
79%  C9
78%  C7
77%  C4
76%  C2
75%  BF
74%  BD
73%  BA
72%  B8
71%  B5

70%  B3
69%  B0
68%  AD
67%  AB
66%  A8
65%  A6
64%  A3
63%  A1
62%  9E
61%  9C

60%  99
59%  96
58%  94
57%  91
56%  8F
55%  8C
54%  8A
53%  87
52%  85
51%  82

50%  80
49%  7D
48%  7A
47%  78
46%  75
45%  73
44%  70
43%  6E
42%  6B
41%  69

40%  66
39%  63
38%  61
37%  5E
36%  5C
35%  59
34%  57
33%  54
32%  52
31%  4F

30%  4D
29%  4A
28%  47
27%  45
26%  42
25%  40
24%  3D
23%  3B
22%  38
21%  36

20%  33
19%  30
18%  2E
17%  2B
16%  29
15%  26
14%  24
13%  21
12%  1F
11%  1C

10%  1A
9%  17
8%  14
7%  12
6%  0F
5%  0D
4%  0A
3%  08
2%  05
1%  03
0%  00 

1
สิ่งนี้จะเพิ่มคำตอบที่มีอยู่?
รหัส - ฝึกงาน

6
@ Code-Apprentice ฉันเดาว่าคำตอบนี้มีประโยชน์เมื่อคุณต้องการความโปร่งแสงที่ละเอียดยิ่งขึ้นเช่น 87% หรือ 54% เหมือนกับที่กล่าวไว้ในmaterial.google.com/style/color.html#color-color-schemes
Bruce

5
ใช่เมื่อวานนี้ฉันต้องการจัดการอัลฟา 13% และฉันตัดสินใจที่จะเพิ่มผลการค้นหาของฉันไปยังเธรดที่มีประโยชน์นี้
carlol

ถ้าฉันต้องการทำให้ LinearLayout โปร่งใสสมบูรณ์โดยไม่มีสีใด ๆ
Si8

1
มุมมองทั้งหมดจะโปร่งใสโดยค่าเริ่มต้นคุณสามารถใช้โปรแกรม mLinearLayout.setBackgroundColor (Color.TRANSPARENT) โดยทางโปรแกรม หรือ android: background = "@ android: color / transparent" ใน xml ของคุณหากคุณจำเป็นต้องบังคับด้วยเหตุผลบางประการ (เห็นได้ชัดว่าสีนี้ไม่ได้รับการสืบทอดจากมุมมองของเด็ก)
carlol

106

ใช้สีที่มีค่า alpha ชอบ#33------และตั้งเป็นพื้นหลังของ editText android:background=" "ของคุณโดยใช้แอตทริบิวต์ของ

  1. 0% (โปร่งใส) -> # 00 ในฐานสิบหก
  2. 20% -> # 33
  3. 50% -> # 80
  4. 75% -> # C0
  5. 100% (ทึบแสง) -> #FF

255 * 0.2 = 51 →ใน hex 33


91

คุณสามารถลองทำสิ่งต่อไปนี้:

textView.getBackground().setAlpha(51);

ที่นี่คุณสามารถตั้งค่าความทึบแสงระหว่าง 0 (เต็มโปร่งใส) ถึง 255 (ทึบแสงสมบูรณ์) 51 เป็น 20% ที่คุณต้องการ


17
@koti เพราะคุณตัวแปรtextView null
yugidroid

วิธีการแก้ปัญหาที่สง่างามดี ฉันสามารถใช้สิ่งนี้กับพื้นหลังรายการเมื่อฉันเลือกมัน - ดังนั้นฉันจึงได้สี แต่มันไม่ได้แข่งขันกับข้อความในรายการ .. เจ๋งมากขอบคุณ!
ยีนโบ

setAlpha (int) ถูกคัดค้าน setAlpha (float) โดยที่ 0 มีความโปร่งใสเต็มที่และ 1 คือ myImage.setAlpha ทึบแสงเต็มที่ (0.5f)
polmabri

@polmabri ไม่ได้จริงๆ myImage.setAlpha(0.5f);ใช้อัลฟ่ากับตัวเอง แต่สิ่งที่ฉันแสดงในคำตอบของฉันถูกนำไปใช้กับพื้นหลังของมุมมองที่วาดได้
yugidroid

นี่อาจทำให้เกิดข้อบกพร่องกราฟิก! ใช้ด้วยความระมัดระวังและทดสอบมากมาย
Michael


32

ดูภาพหน้าจอ

ฉันมีสามมุมมอง ในมุมมองแรกฉันตั้งค่าสีเต็ม (ไม่มีตัวอักษร) ในมุมมองที่สองฉันตั้งค่าสีครึ่งหนึ่ง (0.5 อัลฟา) และในมุมมองที่สามฉันตั้งค่าสีอ่อน (0.2 อัลฟา)

คุณสามารถตั้งค่าสีใด ๆ และรับสีด้วยอัลฟาโดยใช้รหัสด้านล่าง:

ไฟล์activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools = "http://schemas.android.com/tools"
    android:layout_width = "match_parent"
    android:layout_height = "match_parent"
    android:gravity = "center"
    android:orientation = "vertical"
    tools:context = "com.example.temp.MainActivity" >

    <View
        android:id = "@+id/fullColorView"
        android:layout_width = "100dip"
        android:layout_height = "100dip" />

    <View
        android:id = "@+id/halfalphaColorView"
        android:layout_width = "100dip"
        android:layout_height = "100dip"
        android:layout_marginTop = "20dip" />

    <View
        android:id = "@+id/alphaColorView"
        android:layout_width = "100dip"
        android:layout_height = "100dip"
        android:layout_marginTop = "20dip" />

</LinearLayout>

ไฟล์MainActivity.java

public class MainActivity extends Activity {

    private View fullColorView, halfalphaColorView, alphaColorView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        fullColorView = (View)findViewById(R.id.fullColorView);
        halfalphaColorView = (View)findViewById(R.id.halfalphaColorView);
        alphaColorView = (View)findViewById(R.id.alphaColorView);

        fullColorView.setBackgroundColor(Color.BLUE);
        halfalphaColorView.setBackgroundColor(getColorWithAlpha(Color.BLUE, 0.5f));
        alphaColorView.setBackgroundColor(getColorWithAlpha(Color.BLUE, 0.2f));
    }


    private int getColorWithAlpha(int color, float ratio) {
        int newColor = 0;
        int alpha = Math.round(Color.alpha(color) * ratio);
        int r = Color.red(color);
        int g = Color.green(color);
        int b = Color.blue(color);
        newColor = Color.argb(alpha, r, g, b);
        return newColor;
    }
}

รุ่น Kotlin:

private fun getColorWithAlpha(color: Int, ratio: Float): Int {
  return Color.argb(Math.round(Color.alpha(color) * ratio), Color.red(color), Color.green(color), Color.blue(color))
}

เสร็จสิ้น


30

เราสามารถทำให้โปร่งใสในทาง dis ด้วย

รหัสสีขาว - FFFFFF

ขาว 20% - # 33 FFFFFF

20% - 33

70% ขาว - # B3 FFFFFF

70% - B3

ค่าฐานสิบทั้งหมดจาก 100% เป็น 0%

100% - FF, 99% - FC, 98% - FA, 97% - F7, 96% - F5, 95% - F2, 94% - F0, 93% - ED, 92% - EB, 91% - E8, 90% - E6, 89% - E3, 88% - E0, 87% - DE, 86% - ฐานข้อมูล, 85% - D9, 84% - D6, 83% - D4, 82% - D1, 81% - CF, 80% - CC, 79% - C9, 78% - C7, 77% - C4, 76% - C2, 75% - BF, 74% - BD, 73% - BA, 72% - B8, 71% - B5, 70% - B3 , 69% - B0 68% - โฆษณา 67% - AB, 66% - A8, 65% - A6, 64% - A3, 63% - A1, 62% - 9E, 61% - 9C, 60% - 99, 59% - 96, 58% - 94, 57% - 91, 56% - 8F, 55% - 8C, 54% - 8A, 53% - 87, 52% - 85, 51% - 82, 50% - 80, 49% - 7D, 48% - 7A, 47% - 78, 46% - 75, 45% - 73, 44% - 70, 43% - 6E, 42% - 6B, 41% - 69, 40% - 66, 39% - 63, 38% - 61, 37% - 5E, 36% - 5C, 35% - 59, 34% - 57, 33% - 54, 32% - 52, 31% - 4F, 30% - 4D, 29% - 4A, 28% - 47, 27% - 45, 26% - 42, 25% - 40, 24% - 3D, 23% - 3B, 22% - 38, 21% - 36, 20% - 33 , 19% - 30, 18% - 2E, 17% - 2B, 16% - 29, 15% - 26, 14% - 24, 13% - 21, 12% - 1F, 11% - 1C, 10% - 1A, 9% - 17, 8% - 14, 7% - 12, 6% - 0F, 5% - 0D, 4% - 0A, 3% - 08, 2% - 05, 1% - 03, 0% - 00


1
คำตอบที่น่าอัศจรรย์ ให้ทัน
Tarun

22

ค่าฐานสิบหกทั้งหมดตั้งแต่ 100% ถึง 0% อัลฟาคุณสามารถตั้งค่าสีใด ๆ ด้วยค่าอัลฟาที่กล่าวถึงด้านล่าง เช่น #FAFFFFFF (ARRGGBB)

100%  FF
99%  FC
98%  FA
97%  F7
96%  F5
95%  F2
94%  F0
93%  ED
92%  EB
91%  E8
90%  E6
89%  E3
88%  E0
87%  DE
86%  DB
85%  D9
84%  D6
83%  D4
82%  D1
81%  CF
80%  CC
79%  C9
78%  C7
77%  C4
76%  C2
75%  BF
74%  BD
73%  BA
72%  B8
71%  B5
70%  B3
69%  B0
68%  AD
67%  AB
66%  A8
65%  A6
64%  A3
63%  A1
62%  9E
61%  9C
60%  99
59%  96
58%  94
57%  91
56%  8F
55%  8C
54%  8A
53%  87
52%  85
51%  82
50%  80
49%  7D
48%  7A
47%  78
46%  75
45%  73
44%  70
43%  6E
42%  6B
41%  69
40%  66
39%  63
38%  61
37%  5E
36%  5C
35%  59
34%  57
33%  54
32%  52
31%  4F
30%  4D
29%  4A
28%  47
27%  45
26%  42
25%  40
24%  3D
23%  3B
22%  38
21%  36
20%  33
19%  30
18%  2E
17%  2B
16%  29
15%  26
14%  24
13%  21
12%  1F
11%  1C
10%  1A
9%  17
8%  14
7%  12
6%  0F
5%  0D
4%  0A
3%  08
2%  05
1%  03
0%  00

19

ตอนนี้Android Studio 3.3และเวอร์ชันใหม่กว่ามีคุณสมบัติ inbuilt เพื่อเปลี่ยนอัลฟ่าค่าของสี

เพียงคลิกที่สีใน Android บรรณาธิการสตูดิโอและให้ค่าอัลฟาpercentage

สำหรับข้อมูลเพิ่มเติมดูภาพด้านล่าง

ป้อนคำอธิบายรูปภาพที่นี่


18

มีค่า XML alphaที่รับค่าสองเท่า

ตั้งแต่API 11+ช่วงจาก0fถึง1f(รวม) 0fมีความโปร่งใสและ1fทึบแสง:

  • android:alpha="0.0" นั่นคือมองไม่เห็น

  • android:alpha="0.5" ดูผ่าน

  • android:alpha="1.0" มองเห็นได้เต็มรูปแบบ

มันเป็นวิธีการทำงาน


1
ที่จะทำให้เค้าโครงทั้งหมดกึ่งโปร่งใสรวมถึงเนื้อหา
jack_the_beast

7
<TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:alpha="0.9"
        />

ช่วงตั้งแต่ 0 (โปร่งใส) ถึง 1 (ทึบแสง) ใน Android API 11+


3

ดูความนิยมด้านล่าง textView โดยใช้สิ่งนี้

     android:alpha="0.38"

ป้อนคำอธิบายรูปภาพที่นี่

XML

android:color="#3983BE00"    // Partially transparent sky blue

แบบไดนามิก

btn.getBackground () setAlpha (128). // 50% โปร่งใส

tv_name.getBackground () setAlpha (128). // 50% โปร่งใส

Where the INT ranges from 0 (fully transparent) to 255 (fully opaque).


  <TextView
            style="@style/TextAppearance.AppCompat.Caption"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:alpha="0.38"
            android:gravity="start"
            android:textStyle="bold"
            tools:text="1994|EN" />

หุ่นยนต์: อัลฟา = "0.38"

Text View alpha property set 0.38 to your textView visibility is faid 

3

ใน Kotlin คุณสามารถใช้การใช้อัลฟ่าแบบนี้

   //Click on On.//
    view.rel_on.setOnClickListener{
        view.rel_off.alpha= 0.2F
        view.rel_on.alpha= 1F

    }

    //Click on Off.//
    view.rel_off.setOnClickListener {
        view.rel_on.alpha= 0.2F
        view.rel_off.alpha= 1F
    }

ผลลัพธ์เหมือนในภาพหน้าจอนี้โปร่งใส 20%

หวังว่านี่จะช่วยคุณได้ขอบคุณ


1

ฉันรู้ว่าเป็นคำถามที่เก่ามาก

#ARGBหากคุณต้องการใช้ค่าสีคุณยังสามารถใช้เวอร์ชั่นสั้นที่มี Aค่าของช่องอัลฟ่าอยู่ที่ไหน

ในกรณีที่มีสีขาวมีค่าความโปร่งใสดังต่อไปนี้:

#FFFF  -     0%
#EFFF  -   6,7%
#DFFF  -  13,3%
#CFFF  -  20,0%
#BFFF  -  26,7%
#AFFF  -  33,3%
#9FFF  -  40,0%
#FFF8  -  46,7%
#7FFF  -  53,3%
#6FFF  -  60,0%
#5FFF  -  66,7%
#4FFF  -  73,3%
#3FFF  -  80,0%
#2FFF  -  86,7%
#1FFF  -  93,3%
#0FFF  - 100,0%

ดังนั้นคุณสามารถTextViewเพิ่มบรรทัดต่อไปนี้เพื่อความโปร่งใส 20%:

<TextView
    android:background="#CFFF"
    ... />

0

นี่คือวิธีแก้ปัญหาเชิงโปรแกรมจากคำตอบของ@Aromeroเพื่อคำนวณค่าเลขฐานสิบหกสำหรับช่องอัลฟา :)

 public static void main(String[] args) throws Exception {
    final Scanner scanner = new Scanner(System.in);
    int transPerc;
    float fPerc;
    System.out.println("Enter the transparency percentage without % symbol:");
    while((transPerc=scanner.nextInt())>=0 && transPerc <=100){
        fPerc = (float) transPerc / 100;
        transPerc = Math.round(255 * fPerc);
        System.out.println("= " + Integer.toHexString(transPerc));
        System.out.print("another one please : ");
    }
    scanner.close();
}

3
คำถามถูกติดแท็กสำหรับ Android รหัสนี้ไม่รองรับ Android
Pawan


0

ถ้าคุณต้องการทำให้สีโปร่งใส 50% ใน kotlin

val percentage = 50f/100 //50%
ColorUtils.setAlphaComponent(resources.getColor(R.color.whatEverColor), (percentage * 255).toInt())
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.