Centra il testo verticalmente indipendentemente dall'altezza della vista?

Question

Sto facendo del mio meglio per centrare il testo verticalmente ma non riesco a farlo. Il problema è che ho righe di pulsanti con altezza = fill_parent e peso = 1 e le righe diventano più piccole mio testo comincia a toccare il fondo della vista come visto qui:

Ho provato a rimuovere l'imbottitura , margine, modifica dell'altezza e così via. Ma niente sembra farlo.

Come si può allineare verticalmente anche quando la dimensione del testo è vicina all'altezza della vista?

Ecco il codice per la vista contenente il numero 5:

<Button 
     android:layout_width="fill_parent" 
     android:layout_height="fill_parent" 
     android:text="5" 
     android:layout_weight="1" 
     tools:ignore="HardcodedText" 
     android:clickable="false" 
     android:textSize="90dp" 
     android:textColor="?attr/color1" 
     android:gravity="center" 
     android:paddingLeft="@dimen/normal_margin" 
     android:paddingRight="@dimen/normal_margin" 
     android:padding="0dp" /> 

Answer 1

Secondo il mio consiglio se si dispone di due opzioni per rendere tale layout e getout dal problema che si sta avendo.

1. Utilizzare GridView

Utilizzando GridView si avrà lo stesso spazio in tutte le quattro direzioni (sinistra, destra, in alto, in basso). Non devi preoccuparti della spaziatura uguale per l'elemento della griglia.

<GridView 
    android:id="@+id/album_list" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:layout_weight="1" 
    android:cacheColorHint="#00000000" 
    android:gravity="center" 
    android:numColumns="auto_fit" 
    android:stretchMode="spacingWidthUniform" 
    android:drawSelectorOnTop="true"/> 

Basta provare sopra il codice con il quale avrete tutte vista equamente distribuiti nella griglia.

2. Usare TableLayout e TableRow

favore controlla sotto codice per utilizzare TableLayout e TableRow con l'attributo di avere tutti Vedi equamente distribuite. Anche se riduci l'altezza e la larghezza del TableLayout, rimarrà equamente organizzato in quella vista.

<RelativeLayout 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:paddingLeft="@dimen/activity_horizontal_margin" 
android:paddingRight="@dimen/activity_horizontal_margin" 
android:paddingTop="@dimen/activity_vertical_margin" 
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity"> 

<TableLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="fill_parent" android:layout_height="fill_parent" 
    android:layout_margin="5dp"> 
<TableRow android:weightSum="3" 
    android:layout_weight="1" android:gravity="center"> 
    <Button android:gravity="center" 
     android:textSize="13sp" android:textColor="#000000" 
     android:text="1" android:layout_weight="1"/> 
    <Button android:gravity="center" 
     android:textSize="13sp" android:textColor="#000000" 
     android:text="1" android:layout_weight="1"/> 
    <Button android:gravity="center" 
     android:textSize="13sp" android:textColor="#000000" 
     android:text="1" android:layout_weight="1"/> 
</TableRow> 

    <TableRow android:weightSum="3" android:layout_weight="1" android:gravity="center"> 
     <Button android:gravity="center" 
      android:textSize="13sp" android:textColor="#000000" 
      android:text="1" android:layout_weight="1"/> 
     <Button android:gravity="center" 
      android:textSize="13sp" android:textColor="#000000" 
      android:text="1" android:layout_weight="1"/> 
     <Button android:gravity="center" 
      android:textSize="13sp" android:textColor="#000000" 
      android:text="1" android:layout_weight="1"/> 
    </TableRow> 

    <TableRow android:weightSum="3" android:layout_weight="1" android:gravity="center"> 
     <Button android:gravity="center" 
      android:textSize="13sp" android:textColor="#000000" 
      android:text="1" android:layout_weight="1"/> 
     <Button android:gravity="center" 
      android:textSize="13sp" android:textColor="#000000" 
      android:text="1" android:layout_weight="1"/> 
     <Button android:gravity="center" 
      android:textSize="13sp" android:textColor="#000000" 
      android:text="1" android:layout_weight="1"/> 
    </TableRow> 
</TableLayout> 

Si prega di trovare l'uscita di questo TableLayout.

Fammi sapere se questo problema è stato risolto. Altrimenti, sarò felice di aiutarti ancora.

Enjoy Coding ...:)

Answer 2

progettazione questo utilizzando una visualizzazione a griglia si avrà un po 'di funzionalità. altrimenti prendi un layout lineare all'interno del quale impostare altri tre orientamenti orizzontali per il layout orizzontale e il peso sum = 3, posiziona ciascun pulsante sul layout figlio e assegna il peso del layout = 1 per ciascun pulsante.

Answer 3

Ciò non significa che il testo "5" non sia centrato. Il testo "5" appare leggermente al di sotto del centro perché il pulsante non ha abbastanza spazio per impaginare il contenuto del testo. Anche se viene fornita l'altezza adeguata, il testo "5" apparirà leggermente al di sopra del centro. Questo perché, ci sono caratteri ('y', 'g', ecc.) Con discesa più grande di "5" (massima ascesa e discesa possibili sono considerate durante il layout del testo, anche se il testo non contiene glifo o glifo più alto con non zero discesa). Vedi anche this.

Se sono disponibili più altezze per i pulsanti in fila, centreranno ordinatamente i loro testi.

Answer 4

Se questo pulsante si trova all'interno di una finestra lineare con orientamento verticale. Dato che si definisce il peso, si desidera rendere l'altezza "0dp" anziché "fill_parent". Per rendere il testo al centro verticale. Hai provato Android: gravità: "center_vertical"?

Answer 5

Suggerirei di usare uno TextView invece di uno Button, perché questo ha margini meno ingannevoli e offre un maggiore controllo su come posizionare il testo. (In generale, ho solo raramente utilizzare i pulsanti, ma tendo a fare altre viste TextView, ImageView, ... cliccabile invece)

<TextView 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:text="5" 
    android:layout_weight="1" 
    tools:ignore="HardcodedText" 
    android:clickable="false" 
    android:textSize="90dp" 
    android:textColor="?attr/color1" 
    android:gravity="center" 
    android:paddingLeft="@dimen/normal_margin" 
    android:paddingRight="@dimen/normal_margin" 
    android:padding="0dp" /> 

Nel caso in cui avete bisogno di un qualche tipo di indicazione sulla necessità o meno il TextView stato premuto, è possibile aggiungere un selettore come sfondo. Per questo, date un'occhiata here.

Infine, se si desidera che il testo si adatti a eventuali dimensioni di visualizzazione, dare un'occhiata allo AutoFitTextView.

Answer 6

non è possibile utilizzare la spaziatura superiore per il centraggio perché appartiene al carattere. Voglio dire che ogni font ha una metrica di salita e discesa. Vedi la foto qui sotto.

così quando centri Android testo calcola è altezza totale (compresa spaziatura inferiore nad superiore). E che i centri sono risultati retti. È possibile richiamare FontMetrics per visualizzare i valori di origine e discesa dei font. E.g.chiamando Paint.FontMetrics fm = textView.getPaint().getFontMetrics(); otteniamo:

fm = {android.graphics.Paint$FontMetrics@3668} 
ascent = -25.976562 
bottom = 7.5878906 
descent = 6.8359375 
leading = 0.0 
top = -29.572266 

Intresting? Quindi, come rimuovere la spaziatura superiore e inferiore e utilizzare questo spazio per centrare il carattere? Vedo due soluzioni:

• creare componenti personalizzati e testo del layout escludendo tali spaziature. Se vuoi solo testo a riga singola sarà facile. Vedi codice TextView.

• sappiamo le spaziature, quindi possiamo spostare il testo di conseguenza. Imposta la traduzione su a Contenuto del pulsante. Per rimuovere la spaziatura superiore si può fare:
  button.setTranslationY(fm.top - fm.ascent); Se si desidera che il testo centrato senza spaziatura, facciamo seguire: button.setTranslationY((fm.top - fm.ascent) + (fm.bottom - fm.descent));

Answer 7

Penso che il modo più semplice per raggiungere questo obiettivo utilizzando AutoFitTextView

Puoi ottieni questa libreria da questo link: https://github.com/grantland/android-autofittextview

Ridimensiona in modo dinamico le dimensioni del testo con altezza e larghezza correnti.

Spero che questo ti possa aiutare.

Buona fortuna.

Answer 8

Prova questa

<LinearLayout 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:layout_alignParentBottom="true" 
    android:layout_below="@+id/dialer_title" 

    android:orientation="vertical" 
    > 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="0.2" > 

     <ImageButton 
      android:id="@+id/btn1" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_1" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_1_no_vm" /> 

     <ImageButton 
      android:id="@+id/btn2" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_2" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_2" /> 

     <ImageButton 
      android:id="@+id/btn3" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_3" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_3" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="0.2" > 

     <ImageButton 
      android:id="@+id/btn4" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_4" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_4" /> 

     <ImageButton 
      android:id="@+id/btn5" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_5" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_5" /> 

     <ImageButton 
      android:id="@+id/btn6" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_6" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_6" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="0.2" > 

     <ImageButton 
      android:id="@+id/btn7" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_7" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_7" /> 

     <ImageButton 
      android:id="@+id/btn8" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_8" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_8" /> 

     <ImageButton 
      android:id="@+id/btn9" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_9" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_9" /> 
    </LinearLayout> 

    <LinearLayout 
     style="@style/DialPadRow" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="0.2" > 

     <ImageButton 
      android:id="@+id/btnStar" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_astr" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_star" /> 

     <ImageButton 
      android:id="@+id/btn0" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_0" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_0" /> 

     <ImageButton 
      android:id="@+id/btnHash" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_hash" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="false" 
      android:src="@drawable/dial_num_hash" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_weight="0.2" > 

     <ImageButton 
      android:id="@+id/btnContacts" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/string_menu_contacts" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="true" 
      android:src="@drawable/selector_dial_contact_b" /> 

     <ImageButton 
      android:id="@+id/btnCall" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/string_menu_call" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="true" 
      android:src="@drawable/dial_num_call" /> 

     <ImageButton 
      android:id="@+id/btnDelete" 
      style="@style/DialPadButton" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="0.33" 
      android:contentDescription="@string/desc_backspace" 
      android:scaleType="centerCrop" 
      android:soundEffectsEnabled="true" 
      android:src="@drawable/dial_num_delete" /> 
    </LinearLayout> 
</LinearLayout> 

Questo concessionario telefono creerà con dimensioni uguali tasto. Per style = "@ style/DialPadButton" crea uno stile con il nome DialPadButton e personalizza i pulsanti come vuoi. Nel mio caso ho aggiunto item name = "android: layout_margin" con valore 5dp.

Answer 9

tenta di utilizzare un padding superiore negativo, ad esempio:

<Button 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:text="5" 
    android:layout_weight="1" 
    tools:ignore="HardcodedText" 
    android:clickable="false" 
    android:textSize="90dp" 
    android:textColor="?attr/color1" 
    android:gravity="center" 
    android:paddingLeft="@dimen/normal_margin" 
    android:paddingRight="@dimen/normal_margin" 
    android:paddingTop="-2dp" /> 

Si può giocare con questo, e ottenere il valore necessario per la top padding. Naturalmente, è possibile utilizzare valori diversi per densità di schermo diverse usando @dimen.