Question

Can any one help me out how how this widget can be developed as in attached.The widget in the attached is of “Take a photo” or select photo” UI. Just want to know how can we create this UI widget. Any tutorials/and discussions/reference would help.Thank You.

Answer 1

Here is how the xml would look like. You’d have to have a background for the FrameLayout and also 2 for the buttons. One with a full rectangle and the other without the top line. Then some margins/paddings tweaking and you should be fine.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    <ScrollView
        android:id="@+id/scrollView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">


        <LinearLayout
            android:id="@+id/linearLayout1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical" android:layout_gravity="center_vertical|center_horizontal">

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" android:background="#444" android:textColor="#fff" android:layout_marginBottom="1dp"/>

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button" android:background="#444" android:textColor="#fff"/>

        </LinearLayout>
    </ScrollView>

</FrameLayout>

Note: this is based on Mice’s answer.