How to finish layout Android App?

Asked

Viewed 5,433 times

2

How it is done to customize the layout of an Android application. I have seen Apps so well finished and wanted to learn how to give such refinement to my Apps.

The App Toshi Finance is a good example of what I’m talking about.

android android-layout
  • 1

    Is there anything more specific you want to know? In the current form, this question will not get real answers. Just a list of ideas, which is not what we want on a questions and answers: http://meta.pt.stackoverflow.com/questions/486/good-subjective-bad-subjective

2 answers

4


In the code part, to customize a layout or widget exchange the drawable of backgrounds for another with images exchanged.

Like, for example, in a Edittext you can swap the background (both in xml and in code) for one with rounded edges (in the state with or without focus) and this will look like the app you passed as reference. Similarly was made with the buttons, the toggles of this app.

If, for example, you want to apply the changes to all the buttons in the app just create a Theme for your app to change the background of all the buttons.

In XML of Layout

<EditText 
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" 
    android:background="@drawable/meu_edittext_customizado"/>

In Drawable meu_edittext_customizado.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_window_focused="false" android:state_enabled="true" android:drawable="@drawable/meu_edittext_default" />
    <item android:state_window_focused="false" android:state_enabled="false" android:drawable="@drawable/meu_edittext_desativado" />
    <item android:state_enabled="true" android:state_focused="true" android:drawable="@drawable/meu_edittext_ativado" />
    <item android:state_enabled="true" android:state_activated="true" android:drawable="@drawable/meu_edittext_com_foco" />
    <item android:state_enabled="true" android:drawable="@drawable/meu_edittext_default" />
    <item android:state_focused="true" android:drawable="@drawable/meu_edittext_desativado_com_foco" />
    <item android:drawable="@drawable/meu_edittext_desativado" />

</selector>

  • Thank you very much Alexandre was what I wanted to know.

0

  • Step 1:

For mobile apps the part of Layout has its principle in UX Design: The part where you define the experience you expect to have when the user uses the app.

  • Step 2:

After that we apply the UI Design: The part that applies the experience defined in UX Design through visible components such as buttons, tables, animations etc.

Be careful not to confuse: UX x UI

  • Step 3:

The programming part is important when it comes to construir the application that was designed and defined in the previous steps, because if the programmer can not do it will have been in vain all previous effort.

Edit: On the developer’s website Android shows the design principles focused on the platform.

As the question without you does not bring a question related to programming, there is no way to answer giving examples of codes, libraries etc

Browser other questions tagged android android-layout

You are not signed in. Login or sign up in order to post.