Draw Rectangle View with curve bottom In Android

Question

Good day.I want to draw an rectangle as a view but which bottom shall be curved.I do not want to apply background image like that or use any views,because if i use an view and set background,the curve part will still have invisible empty space and i would not be able to attach another curve image to the bottom curve of the custom view.So how shall i draw an rectangle with bottom curved line and use it as a view to set any background color i want?

Notice: i have heard something and read about quadTo() and cubicTo() android methods but i have no clue even how to use them i mean i did not understand anything from documents....So i came here for help.

Ideally instead of such description you could see what i really want to achieve from the image...It is an toolbar or action bar or whatsover but i have to make such thing...I have no ideas at all.(By the way you can notice that there is an image curved on top as well...i have to do it too,and i reckon i can do it by drawing an bitmap.meanwhile i'm still failing to do any of the image parts in android view.)

Solution

Just play with the oval item values to get the desired output.

curve_toolbar_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle"/>
    </item>
    <item
        android:bottom="0dp"
        android:left="-100dp"
        android:right="-100dp"
        android:top="-80dp">
        <shape android:shape="oval">
            <solid android:color="@color/colorPrimary" />
        </shape>
    </item>
</layer-list>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="0dp"
        android:layout_height="?android:attr/actionBarSize"
        android:background="@drawable/curve_toolbar_bg"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0">

    </android.support.v7.widget.Toolbar>
</android.support.constraint.ConstraintLayout>

Comments

[Hasan Abdullah]

android:background="@drawable/rounded_corner" or android:background="@drawable/curve_toolbar_bg" ?

[Sai]

@HasanAbdullah Thanks for pointing out, I have updated the original thread..it should be curve_toolbar_bg.