How to create "responsive layouts" on Android?

Asked

Viewed 582 times

0

I am doubtful how to create a responsive "Layout" to serve on all devices smarts and tablets, so that the text size, buttons adapt properly to each screen, what is the best way and practice for this?

Taking advantage of the subject, giving an example referring to the METEOR javascript framework, in it you can separate the html "tags" by templates not to get the big code and each template or . html you separate by folders, it is possible to do something like this on Android?

1 answer

2


I don’t think you can work like Meteor in the scheme at Android, but Android has layouts that can be used by include, for example:

Its Main Layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/app_bg"
    android:gravity="center_horizontal">

    <include android:id="@+id/news_title"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             layout="@layout/title" />

    <TextView android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:text="@string/hello"
              android:padding="10dp" />
</LinearLayout>

Its reusable/reusable layout:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/titlebar_bg">

    <ImageView android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:src="@drawable/gafricalogo" />
</FrameLayout>

Read about in:

There are also Fragments, but they are a very specific case https://developer.android.com/guide/components/fragments.html

About the "Reponsibility"

Basically you will have to create a Layout for each size, this is not necessarily "responsive", but works well, you can create a layout for each screen so:

res/layout/my_layout.xml              // telas normais (por defeito/por padrão)
res/layout-large/my_layout.xml        // telas largas
res/layout-xlarge/my_layout.xml       // telas muito largas
res/layout-xlarge-land/my_layout.xml  // telas muito largas e em landscape

More details on: https://developer.android.com/guide/practices/screens_support.html

Or you can try the tip of this reply on Soen, if you need to do something with custom sizes you want, an example if the screen is larger than 600:

Configuration config = getResources().getConfiguration();

if (config.smallestScreenWidthDp >= 600) {
    setContentView(R.layout.main_activity_tablet); //activity para tablets
} else {
    setContentView(R.layout.main_activity); //activity normal
}

Webview as an app

There is also the possibility to use WebView to create a Webapp, but it really doesn’t always pay off (it will depend a lot on the case), however if you want to use the Meteor, Bootstrap and related can try this answer:

Browser other questions tagged

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