What better method to create forms in adroid? [closed]

3

I am creating a registration form, to add and edit records in SQL.

I found a place that I meant to do through ScrollView , so the form has a scroll, and in my case it would be accurate, since the fields exceed the size of the screen.

But my result is getting very ugly:

IfoundtheschemasshownintheMaterialDesigndocumentationveryinteresting:

link

But only the measurements are displayed, it does not show XML examples, and I have no idea how to make it look better.

Could anyone give me some tips for better layout layouts, or layouts in general ??

Does anyone know if there is any place with examples of free XML layouts for android studio ??

Here is the layout code I've done so far:

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorBackground"
android:scrollbars="vertical"
tools:context="br.com.teste.ActivityEmpresaCad">

<LinearLayout
    android:layout_width="fill_parent"
    android:orientation="vertical"
    android:layout_height="wrap_content">

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <EditText
        android:id="@+id/EstEndereco"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:hint="@string/formendereco"
        android:inputType="textPostalAddress"></EditText>

    <EditText
        android:id="@+id/EstEndNum"
        android:layout_width="30dp"
        android:layout_height="wrap_content"
        android:hint="@string/formendnumero"
        android:inputType="textPersonName"></EditText>

    </LinearLayout>

    <EditText
        android:id="@+id/EstEndCompl"
        android:layout_height="wrap_content"
        android:hint="@string/formcomplemento"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/EstEndBairro"
        android:layout_height="wrap_content"
        android:hint="@string/formbairro"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/EstEndLat"
        android:layout_height="wrap_content"
        android:hint="@string/formlatitude"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/EstEndLng"
        android:layout_height="wrap_content"
        android:hint="@string/formlongitude"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <Spinner
        android:id="@+id/ExibEndereco"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:entries="@array/exibEndlist"
        android:prompt="@string/formexibirendereo"
        android:spinnerMode="dialog"></Spinner>

    <EditText
        android:id="@+id/EmprNome"
        android:layout_height="wrap_content"
        android:hint="@string/formnomempresa"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/DescBasica"
        android:layout_height="wrap_content"
        android:hint="@string/formdescricaobasica"
        android:inputType="textMultiLine"
        android:lines="2"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/DescSobre"
        android:layout_height="wrap_content"
        android:hint="@string/formsobrempresa"
        android:inputType="textMultiLine"
        android:lines="5"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/DescProdServicos"
        android:layout_height="wrap_content"
        android:hint="@string/fomrsobreprodservicos"
        android:inputType="textMultiLine"
        android:lines="5"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/EmprRazaoSocial"
        android:layout_height="wrap_content"
        android:hint="@string/formrazaosocial"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/EmprCNPJ"
        android:layout_height="wrap_content"
        android:hint="@string/formcnpj"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/EmprWebsite"
        android:layout_height="wrap_content"
        android:hint="@string/formwebsite"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <EditText
        android:id="@+id/EmprEmail"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/formemail"
        android:inputType="textEmailAddress"></EditText>

    <EditText
        android:id="@+id/TelefonePri"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:hint="@string/formtelprincipal"
        android:inputType="phone"></EditText>

    <EditText
        android:id="@+id/TelefoneOutrs"
        android:layout_height="wrap_content"
        android:hint="@string/formoutrostels"
        android:inputType="textPersonName"
        android:layout_width="fill_parent">
    </EditText>

    <Spinner
        android:id="@+id/ExibTelefone"
        android:layout_height="wrap_content"
        android:prompt="@string/formexibirtelefone"
        android:layout_width="fill_parent"
        android:entries="@array/exibTellist">
    </Spinner>

    <Button
        android:id="@+id/BtnSaveEmpresa"
        android:layout_height="wrap_content"
        android:text="@string/formbtnsalvar"
        android:onClick="saveEmpresa"
        android:layout_width="fill_parent">
    </Button>

</LinearLayout>

</ScrollView>

---- UPDATED ----

As suggested by @regmoraes in using ConstraintLayout , I've refactored the form and it's getting a lot better. I decided to change the colors too.

Below is the result of the new layout:

A thousand times better and more organized.

    
asked by anonymous 06.09.2017 / 04:55

1 answer

2

Honestly, this is a UX + UI issue. You can even use the Material Design components to follow the guideline, but how these components will be organized and their style is up to you.

Regarding the form creation tips, I suggest splitting it into sections in the scrollview or different screens. In this way the filling is divided into categorized steps (Personal Data, Address, Contact etc.) and does not get so dull.

As for the examples, you can find some in UpLabs

    
06.09.2017 / 14:52