PDM EditText

De MediaWiki
Ir a la navegación Ir a la búsqueda

Introdución

  • O control EditText serve para introducir e editar texto por parte do usuario dunha aplicación Android.
  • Este control é unha subclase da clase TextView que se viu anteriormente.

00 Part of Android View Hierarchy.png


  • A forma de engadir un EditText en XML nun layout é a través do compoñente: <EditText/>
  • Unha propiedade importante é: android:inputType
    • Permitirá que so se introduzan números, texto, passwords, teléfonos, etc.
    • Tamén indicará se o control é dunha soa liña ou multiliña.
    • Facer que non autocomplete as palabras, etc.
  • Ademais permiten copiar, cortar e pegar.

00 edittext-noextract.png

  • Cando se entra nun cadro de texto, nun dispositivo que non teña teclado físico conectado, abrirase en pantalla un teclado virtual (tamén chamado lixeiro/soft) que se adaptará á propiedade android:inputType como veremos a continuación.
  • Finalmente a tecla Enter no teclado virtual poder realizar distintas accións, ben por defecto ou ben explicitamente coa propiedade android:imeOptions (IME: Input Method Editor)




Casos prácticos

Lembrar que se estades a empregar as bibliotecas de compatibilidade (por defecto), a vosa activity derivará de AppCompactActivity e non de Activity.
Nos exemplos seguintes toda activity deriva de Activity, pero o normal é que empregedes AppCompactActivity (coidado ao copiar os exemplos).
Se non o temos creado antes, crea un paquete de nome UI como un subpaquete do teu paquete principal.
Dentro do paquete UI, crearemos un novo paquete de nome: EditTexto.



  • Dentro do paquete EditTexto crear unha nova 'Empty Activity' de nome: UD02_01_EditText de tipo Launcher e sen compatibilidade.
Modifica o arquivo AndroidManifiest.xml e engade unha label á activity como xa vimos na creación do proxecto base.


Distintos tipos de datos: a propiedade android:inputType

  • Máis información sobre todos os posibles valores de InputType neste enlace.


  • A imaxe amosa un AVD con distintos tipos de campos, e cunha lenda interior indicando que tipo de dato hai que introducir nese campo.

PDM EditText 1.jpg

  • O layout xml que define esa pantalla é o seguinte. Observar como sempre as liñas marcadas.
 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical" >
 6 
 7     <EditText
 8         android:layout_width="match_parent"
 9         android:layout_height="wrap_content"
10         android:hint="Escribe un número enteiro"
11         android:inputType="numberSigned" />
12 
13     <EditText
14         android:layout_width="match_parent"
15         android:layout_height="wrap_content"
16         android:hint="Escribe un número decimal"
17         android:inputType="numberSigned|numberDecimal" />
18 
19     <EditText
20         android:layout_width="match_parent"
21         android:layout_height="wrap_content"
22         android:hint="Escribe palabras...(saíra a 1ª letra en maísculas)"
23         android:inputType="textCapWords|textMultiLine" />
24 
25     <EditText
26         android:layout_width="match_parent"
27         android:layout_height="wrap_content"
28         android:hint="Enderezo e-mail. Esta línea sae por fóra da pantalla"
29         android:inputType="textEmailAddress" />
30 
31     <EditText
32         android:layout_width="match_parent"
33         android:layout_height="wrap_content"
34         android:hint="Escribe a clave."
35         android:inputType="textPassword" />
36 
37 </LinearLayout>
  • Propiedade android:hint: indica o texto que se vai amosar no control cando este está baleiro.
  • Propiedade android:inputType: indica o tipo de datos que se poden introducir no campo.
    • Se non se pon a propiedade, o campo acepta toda combinación de caracteres.
    • Pódense combinar os filtros facendo uso de "|".
  • Obviamente os valores dos Hints é mellor telos declarados en constantes en recursos XML.


  • 'NOTA Edición 2015: No caso de usar un AVD con API 21, o botón Next é substituído por ">", o botón Done (Feito) por unha marca de verificación.


Distintas accións da tecla "Enter": android:imeOptions

  • A tecla Enter no teclado virtual pode realizar unha serie de accións:
    • Por defecto:
      • o sistema determina se existe outro elemento ao que poida ir o foco, nese caso a función da tecla é Next.
      • Se non o atopa a acción da tecla é Done.
      • Salvo nalgúns inputType como por exemplo o multiliña.
    • Podemos asignar explicitamente que acción se desexa que se leve a cabo cada caixa de texto. Para iso está o atributo android:imeOptions.
      • Que dun campo vaia ao anterior, que envíe o texto, que busque o texto, etc. En referencias está un enlace ás posibles accións.
  • O seguinte XML vai e a mesma pantalla anterior, só que as accións da tecla Enter para algúns EditText foi cambiada. Observar as accións definidas nas liñas marcadas.
 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical" >
 6 
 7     <EditText
 8         android:layout_width="match_parent"
 9         android:layout_height="wrap_content"
10         android:hint="Escribe un número enteiro"
11         android:imeOptions="actionDone"
12         android:inputType="numberSigned" />
13 
14     <EditText
15         android:layout_width="match_parent"
16         android:layout_height="wrap_content"
17         android:hint="Escribe un número decimal"
18         android:imeOptions="actionPrevious"
19         android:inputType="numberSigned|numberDecimal" />
20 
21     <EditText
22         android:layout_width="match_parent"
23         android:layout_height="wrap_content"
24         android:hint="Escribe palabras...(saíra a 1ª letra en maísculas)"
25         android:inputType="textCapWords|textMultiLine" />
26 
27     <EditText
28         android:id="@+id/et_mail"
29         android:layout_width="match_parent"
30         android:layout_height="wrap_content"
31         android:hint="Enderezo e-mail. Esta línea sae por fóra da pantalla"
32         android:imeOptions="actionSend"
33         android:inputType="textEmailAddress" />
34 
35     <EditText
36         android:layout_width="match_parent"
37         android:layout_height="wrap_content"
38         android:hint="Escribe a clave."
39         android:inputType="textPassword" />
40 
41 </LinearLayout>





Foco

  • Por defecto sempre vai ter o foco o primeiro edittext que se atope na ventá de ComponentTree no deseñador de layout.
  • Cando cargamos un Layout podemos indicar cal vai ser o View por defecto ao que vai ir o foco saltándanos a regra anterior.
Para iso temos que empregar a etiqueta: <requestFocus /> dentro do View ao que queramos que vaia o foco ao iniciar a activity.
 1     <EditText
 2         android:id="@+id/evEmail"
 3         android:layout_width="0dp"
 4         android:layout_height="wrap_content"
 5         android:layout_marginStart="16dp"
 6         android:hint="@string/email_Alta_Empr"
 7         android:inputType="textEmailAddress"
 8         app:layout_constraintEnd_toStartOf="@+id/guideline3"
 9         app:layout_constraintHorizontal_bias="0.0"
10         app:layout_constraintStart_toStartOf="parent"
11         app:layout_constraintTop_toBottomOf="@+id/evTfno">
12         <requestFocus />
13     </EditText>
Fixarse que dita etiqueta non está dentro da etiqueta <EditText ....> como o resto de atributos e tivemos que quitar o fin de etiqueta (/) ao final para poñer unha etiqueta </EditText>
  • No caso de querer facelo por programación teríamos que chamar ao método requestFocus() da forma:
1     @Override
2     protected void onCreate(Bundle savedInstanceState) {
3         super.onCreate(savedInstanceState);
4         setContentView(R.layout.activity_operar_empregados);
5 
6         EditText email = findViewById(R.id.evEmail);
7         email.requestFocus();
8         
9     }
Cando temos EditText, normalmente o foco pasa ao primeiro da lista e aparece o teclado virtual por defecto.
En algúns sitios indica que se poñemos o foco sobre o view diferente a un EditText, o teclado desaparece, pero eu fancendo probas, algunhas veces funciona e outras non.
A forma que atopei de ocultar o teclado virtual ao arrancar a activity é poñendo no método onCreate: getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN);


  • Para facer que o control pase dun view a outro facendo Tab no teclado virtual, teríamos que empregar no layout a propiedade nextFocusForward da forma: android:nextFocusForward="@id/etNome"
  • Para facer que o control pase dun view a outro premendo na frecha do teclado virtual, teríamos que empregar no layout a propiedade nextFocusDown da forma: android:nextFocusDown="@id/etNome"

Accesibilidade

Dito modo vai 'ler' a descrición de cada elemento.
  • Como norma xeral podemos dar as seguintes pautas:
Un <TextView> terá que ter o atributo 'android:hint' como se amosa no seguinte exemplo:
 1     <EditText
 2         android:id="@+id/etNome_UD03_01_Intents"
 3         android:layout_width="wrap_content"
 4         android:layout_height="wrap_content"
 5         android:layout_marginStart="8dp"
 6         android:layout_marginTop="8dp"
 7         android:ems="10"
 8         android:inputType="textPersonName"
 9         android:hint="Nome a enviar"
10         app:layout_constraintStart_toEndOf="@+id/textView7"
11         app:layout_constraintTop_toTopOf="parent" />


  • No caso de que o EditText estea asociado a un TextView, podemos substituír dito atributo polo atributo: android:labelFor do TextView o cal indica cal é o EditText asociado ao TextView.
 1     <TextView
 2         android:id="@+id/textView7"
 3         android:layout_width="wrap_content"
 4         android:layout_height="wrap_content"
 5         android:layout_marginStart="8dp"
 6         android:layout_marginTop="8dp"
 7         android:text="Dime o teu nome:"
 8         android:textSize="18sp"
 9         android:labelFor="@id/etNome_UD03_01_Intents"
10         app:layout_constraintStart_toStartOf="parent"
11         app:layout_constraintTop_toTopOf="@+id/etNome_UD03_01_Intents" />
12 
13     <EditText
14         android:id="@+id/etNome_UD03_01_Intents"
15         android:layout_width="wrap_content"
16         android:layout_height="wrap_content"
17         android:layout_marginStart="8dp"
18         android:layout_marginTop="8dp"
19         android:ems="10"
20         android:inputType="textPersonName"
21         app:layout_constraintStart_toEndOf="@+id/textView7"
22         app:layout_constraintTop_toTopOf="parent" />


  • Para comprobar que non temos problemas de accesibilidade:



Atributos a coñecer

  • Dentro de este control tedes que coñecer e saber empregar os seguintes atributos:
  • id
  • layout_width, layout_height
  • margin
  • padding
  • gravity
  • contentDescription
  • text
  • hint
  • inputType
  • maxLines
  • imeoptions
  • textXXXX (Size, Color, Style, Alignment)
  • fontFamily
  • typeFace
  • visibility
  • ems
  • maxLength



Métodos mínimos a coñecer no manexo dos EditText´s

  • Referenciar a un EditText có método findViewById.
  • Recuperar o contido do texto.
  • Cambiar o contido do texto, podendo empregar recursos gardados en /res/values.
  • Engadir novo texto a un existente.
  • Modificar propiedades básicas, como cor, tamaño, visibilidade,...(e os métodos getZZZZZ para obter os seus valores)
  • Cambiar o foco a un view EditText concreto.
Exemplos:
        EditText et = findViewById(R.id.etvTextoEditText);          // Referenciamos a un EditText que estea na Activity.
        String cadeaet = et.getText().toString();                   // Fixarse que getText() devolve un obxecto Editable, non un String.
        et.setText("Cambiamos o texto directamente");               // Cambiamos o contido por unha cadea concreta
        String textoRes = getResources().getString(R.string.app_name);
        et.setText(textoRes + " texto que ven da BD");      // Se queremos concatenar texto dunha base de datos cun texto que poida ser traducido

        et.append(" engadimos novo texto");                 // append para engadir

        et.setTextSize(20);                                 // Axustar tamaño

        et.setTextColor(Color.BLUE);                        // Cambia a cor

        et.setVisibility(View.VISIBLE);                     // As constantes aparecen no Android Studio ao teclear. GONE fai que non ocupe espazo no Layout.


        EditText et2 = findViewById(R.id.etvTextoEditText2);// Referenciamos a outro EditText que estea na Activity.
        et2.requestFocus();                                 // Cambiamos o foco para ese EditText




Enlace a la página principal de la UD2

Enlace a la página principal del curso



-- Ángel D. Fernández González e Carlos Carrión Álvarez -- (2015).