Come rendere trasparente uno sfondo del 20% su Android

Risposte:

1038

Rendi il colore dell'80% nel canale alfa. Ad esempio, per l'uso in rosso #CCFF0000:

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

Nell'esempio, CCè il numero esadecimale per 255 * 0.8 = 204. Si noti che le prime due cifre esadecimali sono per il canale alfa. Il formato è #AARRGGBB, dove si AAtrova il canale alfa, RRè il canale rosso, GGè il canale verde ed BBè il canale blu.

Suppongo che il 20% di trasparenza significhi l'80% di opaco. Se intendevi il contrario, invece di CCusare 33il valore esadecimale 255 * 0.2 = 51.

Per calcolare il valore corretto per un valore di trasparenza alfa è possibile seguire questa procedura:

  1. Data una percentuale di trasparenza, ad esempio il 20%, sai che il valore percentuale opaco è dell'80% (questo è 100-20=80)
  2. L'intervallo per il canale alfa è di 8 bit ( 2^8=256), il che significa che l'intervallo va da 0 a 255.
  3. Proiettare la percentuale opaca nell'intervallo alfa, ovvero moltiplicare l'intervallo (255) per la percentuale. In questo esempio 255 * 0.8 = 204. Arrotondare al numero intero più vicino, se necessario.
  4. Convertire il valore ottenuto in 3., che è nella base 10, in esadecimale (base 16). Puoi utilizzare Google per questo o qualsiasi altro calcolatore. Usando Google, digita "204 in hexa" e ti darà il valore esadecimale. In questo caso lo è 0xCC.
  5. Prepara il valore ottenuto in 4. al colore desiderato. Ad esempio, per il rosso, che è FF0000, avrai CCFF0000.

Puoi dare un'occhiata alla documentazione di Android per i colori .

— aromero
fonte
Per il colore bianco con trasparenza, secondo la domanda, utilizzare android:background="#CCFFFFFF".
— arrivato il
Come applicare questa regola per uno sfondo con l'immagine?
— user1090751
1517

Usa il codice qui sotto per il nero:

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

Ora, se voglio usare l'opacità, puoi usare il codice seguente: 

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

E sotto per il codice di opacità: e tutti i livelli di opacità qui

Valori di opacità esadecimale

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

Se dimentichi sempre quale codice per la trasparenza, devi vedere il link seguente e non preoccuparti di ricordare nulla riguardo al codice trasparente: -

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

textviewHeader.setTextColor(Color.parseColor(ColorTransparentUtils.transparentColor(R.color.border_color,10)));
— duggu
fonte
3
visto questo ho usato # 99ffffff e ha funzionato bene per me, grazie
— nawaab saab
Come applicare questa regola per uno sfondo con l'immagine?
— user1090751
149

È possibile gestire l'opacità del colore modificando i primi 2 caratteri nella definizione del colore:

# 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
— carlol
fonte
1
Cosa aggiunge questo alle risposte esistenti?
— Apprendista di codice
6
@ Apprendista di codice Immagino che questa risposta sia utile quando hai bisogno di una trasparenza più fine come l'87% o il 54%, come quelli menzionati in material.google.com/style/color.html#color-color-schemes
— Bruce
5
Sì, ieri ho avuto la necessità di gestire un alpha del 13% e ho deciso di aggiungere i miei risultati di ricerca a questa utile discussione.
— Carl
E se volessi rendere trasparente un LinearLayout senza alcun colore?
— Si8,
1
Tutte le viste sono trasparenti per impostazione predefinita, è possibile utilizzare a livello di codice mLinearLayout.setBackgroundColor (Color.TRANSPARENT); o android: background = "@ android: color / transparent" nel tuo xml se devi forzarlo per alcuni motivi (ovviamente questo colore non è ereditato dalle viste figlio)
— carlol
106

Usa un colore con un valore alfa simile #33------e impostalo come sfondo del tuo editText usando l'attributo XML android:background=" ".

  1. 0% (trasparente) -> # 00 in esadecimale
  2. 20% -> # 33
  3. 50% -> # 80
  4. 75% -> # C0
  5. 100% (opaco) -> #FF

255 * 0,2 = 51 → nell'esagono 33

— K_Anas
fonte
91

Puoi provare a fare qualcosa come:

textView.getBackground().setAlpha(51);

Qui è possibile impostare l'opacità tra 0 (completamente trasparente) a 255 (completamente opaco). Il 51 è esattamente il 20% che desideri.

— yugidroid
fonte
17
@koti, perché la tua textViewvariabile è null.
— yugidroid,
bella soluzione elegante. Sono in grado di applicarlo a uno sfondo dell'elenco quando lo seleziono - quindi ottengo un po 'di colore, ma non compete con il testo dell'elemento .. Molto bello, grazie!
— Gene Bo,
setAlpha (int) è deprecato in favore di setAlpha (float) dove 0 è completamente trasparente e 1 è completamente opaco myImage.setAlpha (0.5f);
— polmabri,
@polmabri, non proprio. myImage.setAlpha(0.5f);applica l'alfa alla vista stessa ma ciò che mostro nella mia risposta viene applicato al disegno di sfondo della vista.
— yugidroid
Ciò può causare bug grafici! Usare con cautela e molti test.
— Michael,
74

In Android Studio è disponibile uno strumento integrato per regolare il colore e il valore alfa / opacità :

Android regola l'opacità del colore

— Jayakrishnan PM
fonte
32

Vedi screenshot

Ho preso tre punti di vista. Nella prima vista ho impostato il colore completo (senza alfa), nella seconda vista ho impostato la metà (0,5 alfa) e nella terza vista ho impostato il colore chiaro (0,2 alfa).

Puoi impostare qualsiasi colore e ottenere il colore con l'alfa usando il codice seguente:

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

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

Versione di 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))
}

Fatto

— Hiren Patel
fonte
31

Possiamo anche rendere trasparente in modo diverso.

Codice colore bianco - FFFFFF

20% bianco - # 33 FFFFFF

20% - 33

70% bianco - # B3 FFFFFF

70% - B3

Tutti i valori esadecimali dal 100% allo 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% - 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% - 8 ° C, 54% - 8 A, 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% - 5 ° C, 35% - 59, 34% - 57, 33% - 54, 32% - 52, 31% - 4 ° F, 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

— Ashish Kumar
fonte
1
Risposta incredibile. Continuate così.
— Tarun,
22

Tutti i valori esadecimali dal 100% allo 0% alfa, puoi impostare qualsiasi colore con i valori alfa menzionati di seguito. ad es. #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
— Anant Shah
fonte
19

Ora Android Studio 3.3 e versioni successive offrono una funzione integrata per modificare un valore Alpha del colore,

Basta fare clic su un colore nell'editor di studio Android e fornire il valore Alpha inpercentage .

Per maggiori informazioni vedi l'immagine sotto

inserisci qui la descrizione dell'immagine

— Chandan Sharma
fonte
18

Esiste un valore XML alphache accetta valori doppi.

Poiché API 11+l'intervallo va da 0fa 1f(compreso), 0fessendo trasparente e 1fessendo opachi:

  • android:alpha="0.0" questo è invisibile

  • android:alpha="0.5" guardare attraverso

  • android:alpha="1.0" completamente visibile

Funziona così.

— eldivino87
fonte
1
ciò renderà l'intero layout semi-trasparente, incluso il suo contenuto
— jack_the_beast
7 
<TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:alpha="0.9"
        />

L'alfa varia tra 0 (trasparente) e 1 (opaco) nell'API Android 11+

— Naramsim
fonte
3

Vedi Popolarità sotto text Visualizza usando questo 

     android:alpha="0.38"

inserisci qui la descrizione dell'immagine

XML

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

dinamicamente

btn.getBackground () setAlpha (128).; // 50% trasparente

tv_name.getBackground () setAlpha (128).; // 50% trasparente

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

android: alpha = "0,38"

Text View alpha property set 0.38 to your textView visibility is faid
— Keshav Gera
fonte
3

In Kotlin puoi usare alfa in questo modo,

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

Il risultato è come in questa schermata.20% trasparente

Spero che questo ti possa aiutare. Grazie

— Rahul Kushwaha
fonte
1

Lo so, questa è una domanda molto antica.

Se si desidera utilizzare un valore di colore, è possibile utilizzare anche la versione breve di quello con #ARGB. Dov'è Ail valore per il canale alfa.

Nel caso di un colore bianco ci sono i seguenti valori di trasparenza:

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

Quindi puoi TextViewaggiungere la seguente riga per una trasparenza del 20%:

<TextView
    android:background="#CFFF"
    ... />
— gotwo
fonte
0

Ecco una soluzione programmatica dalla risposta di @Aromero per calcolare il valore esadecimale per il canale alfa. :)

 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();
}
— theapache64
fonte
3
La domanda è stata taggata per Android. Questo codice non supporta Android.
— Pawan,
0

Prova questo codice :)

È un codice esadecimale completamente trasparente - "# 00000000"

— Agilanbu
fonte
0

se vuoi rendere il colore trasparente al 50% in kotlin,

val percentage = 50f/100 //50%
ColorUtils.setAlphaComponent(resources.getColor(R.color.whatEverColor), (percentage * 255).toInt())
— Jetwiz
fonte
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.