CODEWITHSUNDEEP
androiddrawableshapes
Johny19
Johny19

Reputation: 5582

Android custom shape for zoom buttons

I'm a bit new with Android UI but I would like to know what is the best way to archive something like this? The only icon I have is 'plus' and 'minus'.

enter image description here

Is there a way with a custom drawable shape to build this 'half circle' shape? (So it would be two shape so that 'plus' and 'minus' are two different actions

Upvotes: 3

Views: 685

Answers (1)

Pedro Cardoso
Pedro Cardoso

Reputation: 421

Yes, you can create a shape like this:

<!--roundbox-->
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#999999" />
    <stroke android:color="#000000" />
    <corners android:radius="@dimen/round_button_size" />
</shape>

and in the layout:

<LinearLayout
    android:layout_width="@dimen/round_button_size"
    android:layout_height="100dp"
    android:orientation="vertical"
    android:weightSum="2"
    android:background="@drawable/roundbox">

    <Button
        android:id="@+id/plus_button"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:src="@drawable/plus" />

    <View
        android:layout_width="match_parent"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:layout_height="1dp" android:background="#000" />

    <Button
        android:id="@+id/minus_button"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:src="@drawable/minus" />

</LinearLayout>

also added this in the dimens.xml file:

<dimen name="round_button_size">50dp</dimen>

If you really want two separate shapes: 

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#999999" />
    <stroke android:color="#000000" />
    <corners android:topLeftRadius="@dimen/round_button_size" android:topRightRadius="@dimen/round_button_size"/>
</shape>

and:

<Button
    android:src="@drawable/plus"
    android:layout_width="@dimen/round_button_size"
    android:layout_height="55dp"
    android:background="@drawable/round_button"/>

Upvotes: 2

Related Questions