Skip to content Skip to sidebar Skip to footer

How To Create Curved Background In Android Layout

I had done some changes in height and width of map layout and got the output as below click to view image but i want the .XML file to look like this click to view image2 this is w

Solution 1:

It took a bit of my time..

There may be many other smart ways to do it. But the following solution came into my mind..

The trick is draw image in paint convert it to svg then to vector. Set that image as src for image view

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="#FF0000"
android:orientation="vertical"
tools:context="p.httpwww.intosanket.login">

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="300dp">

    <fragment xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:map="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/map"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        tools:context="p.httpwww.intosanket.MapsActivity" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:scaleType="fitXY"
        android:src="@drawable/bg" />

</RelativeLayout>


<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:gravity="center_horizontal"
    android:orientation="horizontal">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/msg" />

    <EditText
        android:id="@+id/e1"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:hint="  E-Mail/Adresse" />
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:orientation="horizontal">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/lock" />

    <EditText
        android:id="@+id/e2"
        android:layout_width="300dp"
        android:layout_height="wrap_content"
        android:hint="  Password"
        android:paddingTop="12dp" />

</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center">

    <Button
        android:id="@+id/b1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Sign In" />

    <Button
        android:id="@+id/b2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Register" />

</LinearLayout>

the src for the imageview bg.xml is

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="300.000000dp"
android:height="137.000000dp"
android:viewportWidth="300.000000"
android:viewportHeight="137.000000">

<group
        android:translateY="137.000000"
        android:scaleX="0.100000"
        android:scaleY="-0.100000">
    <path
        android:fillColor="#ff0000"
        android:strokeWidth="1"
        android:pathData="M2985 1328 c-38 -250 -110 -449 -230 -634 -221 -340 -558 -571 -965 -660 -68 -15 -127 -19 -295 -19 -168 0 -227 4 -295 19 -620 136 -1073 603 -1184 1221 -13 73 -14 25 -15 -587 l-1 -668 1500 0 1500 0 0 685 c0 377 -2 685 -4 685 -2 0 -7 -19 -11 -42z" />
</group>

Final result is


Post a Comment for "How To Create Curved Background In Android Layout"