How to draw a dot circle inside a square drawable in android?
Asked Answered
H

2

0

I want a small dot inside a square button , this is what i have tried till now as answered by azizbekian:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <shape android:shape="rectangle">
            <size android:width="100dp" android:height="100dp"/>
            <solid android:color="#38b0ef"/>
        </shape>
    </item>

    <item
        android:bottom="45dp"
        android:left="45dp"
        android:right="45dp"
        android:top="45dp">
        <shape android:shape="oval">
            <stroke android:width="1dp"  android:color="#0c5069"/>
            <size android:width="20dp" android:height="20dp"/>
            <solid android:color="#0c5069"/>
        </shape>
    </item>


</layer-list>

The first image is what i have tried and the second image is what i want excluding the text.

this is how it looks now this is how i want excluding the text

and also this code is the button to which i have to apply the drawable there are seven such buttons in an horizontal linearlayout with weightsum:100 each button has weight 14

<Button
   android:id="@+id/wed"
   android:layout_width="0dp"
   android:layout_height="35dp"
   android:layout_marginEnd="1dp"
   android:background="@drawable/my_button_dot"
   android:text="WED"
   android:textAllCaps="true"
   android:textStyle="bold"
   android:textColor="#ffffff"
   android:layout_weight="15"/>

the dot does not appear in the background when this drawable is applied to the button, maybe because of the size of button and drawable i tried to adjust the size of drawable, but i just do not understand it and it did not work, how can i adjust it such that the dot appears in button background.

Heffron answered 14/4, 2017 at 13:37 Comment(3)
Why do you need layer-list? Why having ordinary oval shape won't do for you?Herzig
i want blue square with a small dot inside as in the second image..Heffron
Why not setting the dot as a separate compoundDrawableBottom attribute?Pantalets
L
2

first create color_circle in drawable

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="oval">


  <solid android:color="#ffffff">


  </solid>

 <size
    android:width="48dp"
    android:height="48dp" />


</shape>

and then

    <RelativeLayout
    android:layout_width="64dp"
    android:layout_height="148dp">

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

        <Button
            android:textAllCaps="true"
            android:textStyle="bold"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="WED" />

    </LinearLayout>


    <View
        android:layout_width="16dp"
        android:layout_height="16dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="16dp"
        android:background="@drawable/color_circle" />


</RelativeLayout>

i hope this is what you want

Locule answered 8/3, 2020 at 7:59 Comment(0)
O
0

This is

ImageView has src to dotted.xml.

<ImageView
  android:layout_width="178.8dp"
  android:layout_height="178.8dp"
  android:src="@drawable/dotted"
  android:layout_centerInParent="true"
  android:layerType="software" />
add below to drawable/dotted.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
  <stroke
    android:color="@android:color/white"
    android:dashWidth="1px"
    android:dashGap="10px"
    android:width="6.6dp"/>
</shape>
Oarfish answered 17/6, 2020 at 2:50 Comment(1)
Indentation changesCrumpler

© 2022 - 2024 — McMap. All rights reserved.