26

È possibile rendere solo l'asterisco nel suggerimento rosso quando si utilizza TextInputLayout dalla libreria di supporto di progettazione? Ho visto informazioni sullo stile dell'intero suggerimento, ma questo è un po 'più complesso in quanto solo il * dovrebbe essere rosso, non l'intero messaggio.Come rendere rosso l'asterisco di TextInputLayout per i campi obbligatori

L'esempio di Material Design mostra questo, ma la libreria di progettazione non sembra avere alcuna opzione per modificarla in questo modo utilizzando TextInputLayout e EditText.

Riferimento: https://www.google.com/design/spec/components/text-fields.html#text-fields-required-fields

Esempio (la parte superiore, con messa a fuoco, ha l'asterisco rosso, basso, senza messa a fuoco non ha un asterisco rosso):

Example of hint text with red asterisk

Ho guardato in ambiente il suggerimento a SpannableString (vedi qui How to get a red asterisk in a <string> entry) in un OnFocusChangeListener (vedi qui Having the mandatory symbol to the edit text (red color asterisk) which is inside the textinputlayout), ma il suggerimento è un CharSequence.

C'è un modo per farlo senza estendere TextInputLayout?

+1

hai trovato qualche soluzione? – praj

+1

No, attualmente sto pianificando di lasciarlo così com'è finché la libreria di progettazione non supporta l'asterisco rosso. – ProjectJourneyman

+0

Quando lo uso, la barra non viene visualizzata per il mio sotto EditText.Hai fatto qualcosa di speciale per farlo apparire? – fobbymaster

risposta

1
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> 
    <!-- Customize your theme here. --> 
    <item name="colorPrimary">@color/colorPrimary</item> 
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item> 
    <item name="colorAccent">@color/black</item> 
</style> 

cambiamento che il tema colorAccent e vedere

+0

Vedere [l'esempio di materiale] (https://material.google.com/style/color.html#color-color-schemes), c'è un capitolo su questo. Dovresti aggiungere queste informazioni nella tua risposta. Ma questo potrebbe cambiare più cose del previsto. – AxelH

-1

Sì, è possibile, perché sto facendo stessa cosa nella mia applicazione corrente. e per la messa a fuoco e lo sfocatura, devi fare qualche logica per rimuovere l'asterisco.

String mm = "Legal first name"; 
Spannable WordtoSpan = new SpannableString(mm); 
WordtoSpan.setSpan(
     new ForegroundColorSpan(Color.parseColor("#e62e6c")), 
     16, 
     mm.length(), 
     Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); 
WordtoSpan.setSpan(new RelativeSizeSpan(0.9f), 16, mm.length(), 0); 
view.setText(WordtoSpan); 
+0

no non può farlo con un TextInputLayout: https://code.google.com/p/android/issues/detail?id=197889 – Roubachof

-1

Sono stato attraverso lo stesso processo e ha funzionato per me

TextView text = (TextView) rootView.findViewById(R.id.name_textview); 

SpannableStringBuilder builder1 = setStarToLabel("Name"); 

text.setText(builder1); 

    @NonNull 
private SpannableStringBuilder setStarToLabel(String text) { 
    String simple = text; 
    String colored = "*"; 
    SpannableStringBuilder builder = new SpannableStringBuilder(); 
    builder.append(simple); 
    int start = builder.length(); 
    builder.append(colored); 
    int end = builder.length(); 
    builder.setSpan(new ForegroundColorSpan(Color.RED), start, end, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE); 
    return builder; 
} 
+0

Questa logica viene applicata a TextView, non al TextInputLayout richiesto – Jutikorn

0

Potrebbe essere l'aggiunta di una stringa di spanning da HTML?

String grey = "Legal first name*"; 
    Spanned redStar; 
    String html = "<string style="color:grey;">Legal first name<span style="color:red;">*</span></string>"; 

    if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.N) { 
    redStar = Html.fromHtml(html,Html.FROM_HTML_MODE_LEGACY); 
    } else { 
    redStar = Html.fromHtml(html); 
    } 

E cambiare il suggerimento a fuoco.

textInput.setOnFocusChangeListener(new View.OnFocusChangeListener() { 
    public void onFocusChange(View v, boolean hasFocus) { 
    if (hasFocus) 
     myEditText.setHint(redStar.toString); 
    else 
     myEditText.setHint(grey); 
} 
0

Change TextInputLayout suggerimento con l'aggiunta di un suffisso avvolto in html:

public void setRequired(boolean required) { 

    componentField.setHint(
    TextUtils.concat(
     componentField.getHint(), 
     Html.fromHtml(
     getContext().getString(
      R.string.required_asterisk)))); 
} 

codice Asterisk deve essere conservato in strings.xml Android per il corretto fuga:

<string name = "required_asterisk"><![CDATA[<font color=\'#cc0029\'>&nbsp*</font>]]></string> 
+1

non funziona per me. Funziona davvero per te? – Jutikorn

3

Material design specificare un asterisco per i campi obbligatori che fanno parte del testo suggerimento e dello stesso colore (non in rosso come hai mostrato nella tua domanda).

In Kotlin questo è davvero semplice:

1.Define questo metodo di estensione:

fun TextInputLayout.markRequired() { 
    hint = "$hint *" 
} 

2.Utilizzare esso:

input_first_name.markRequired() 
+0

Ciao per favore dammi il tuo Android ans usando java. userò questo tipo di TextInputLayout usando. – mujjuraja

+0

@mujjuraja È molto più brutto in Java, ti consiglio [try.kotl.in] (https://try.kotl.in), ma ecco cosa puoi fare: 'inputFirstName.setHint (inputFirstName.getHint() +" * ")' –

Problemi correlati