Android : customized button not showing in avd - android

Hello I tried to customize a button in my app.So in res/drawable-xdpi in a new xml file i put the following code:
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<solid
android:color="#ef4444" />
<stroke
android:width="1dp"
android:color="#992f2f" />
<corners
android:radius="6dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="#ef4444"
android:endColor="#992f2f"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#992f2f" />
<corners
android:radius="6dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
The thing is that in graphical layout the button is customized as it is supposed to be,but when i run the app on AVD the customizations are not displayed and it just shows the default buttons.Am I missing something here?
ALSO:
full xml layout :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#151515" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical" >
</LinearLayout>
<Button
android:id="#+id/button2"
android:layout_width="150dp"
android:layout_height="70dp"
android:layout_above="#+id/button3"
android:layout_centerHorizontal="true"
android:text="#string/gram"
android:background="#drawable/blue_button"
/>
<Button
android:id="#+id/button1"
android:layout_width="150dp"
android:layout_height="70dp"
android:layout_above="#+id/button2"
android:layout_alignLeft="#+id/button2"
android:layout_marginBottom="50dp"
android:text="#string/schedule"
android:background="#drawable/blue_button" />
<Button
android:id="#+id/button3"
android:layout_width="150dp"
android:layout_height="70dp"
android:layout_alignLeft="#+id/button2"
android:layout_below="#+id/linearLayout1"
android:layout_marginTop="54dp"
android:text="#string/announcement"
android:background="#drawable/blue_button" />
</RelativeLayout>

Yeah, I think you are, are your sure your AVD is "HDPI" ? If not, that's your problem !

The red_button.xml file should go in res/drawable folder. If it doesn't exist in your project's hierarchy, add a new folder by right-clicking on res directory and name it drawable.

Related

How to customize spinner box?

I want spinner as dropdown like below images,
I created below like this
xml layout:
<Spinner
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20dp"
android:background="#drawable/edittext_shape"
android:padding="10dp"
android:paddingLeft="4dp"
android:id="#+id/rol_type"
android:layout_marginBottom="2dp">
Spinner shape
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item><layer-list>
<item><shape>
<gradient android:angle="90" android:startColor="#color/white" android:endColor="#color/appblue" />
<stroke android:width="1dp" android:color="#color/block" />
<corners android:radius="4dp" />
<!-- <padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />-->
</shape></item>
<item ><bitmap android:gravity="right|bottom|end" android:src="#drawable/drop_arrow" android:tint="#color/red" />
</item>
</layer-list></item>
</selector>
My output:
I want below like this please help me in this case:
Try this:
I changed your background to style.
You can also extend this style and add your own elements https://developer.android.com/guide/topics/ui/look-and-feel/themes.html
<Spinner
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20dp"
style="#android:style/Widget.Holo.Light.Spinner"
android:padding="10dp"
android:paddingLeft="4dp"
android:id="#+id/rol_type"
android:layout_marginBottom="2dp">

How to make drawable circle shape with count

I really appreciate if someone can help me with using how to drawable circle view with count as like my below image.
I wrote some code for my requirement but it's showing rectangular shape but i want circular shape..
linear_layout_border(drawable file)
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke
android:width="1dp"
android:color="#color/colorPrimary" />
<solid android:color="#color/colorLightSky" />
<padding
android:bottom="2dp"
android:left="10dp"
android:right="10dp"
android:top="2dp" />
</shape>
xml:
<FrameLayout
android:id="#+id/group_attachment_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_margin="3dp"
android:background="#drawable/linear_layout_border">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:src="#drawable/ic_group"
android:tint="#color/rosecolor" />
</RelativeLayout>
<TextView
android:id="#+id/members_count_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|right"
android:layout_marginBottom="3dp"
android:background="#drawable/test_circle"
android:gravity="center"
android:minWidth="15dp"
android:paddingLeft="2dp"
android:paddingRight="2dp"
android:text="0"
android:textColor="#fff"
android:textStyle="bold"
android:visibility="visible" />
</FrameLayout>
image:-
Try this it looks as you want
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<corners
android:radius="10dip"/>
<solid
android:color="#2196F3" />
<stroke
android:width="2dip"
android:color="#FFF" />
<padding
android:left="2dip"
android:right="2dip"
android:top="2dip"
android:bottom="2dip" />
</shape>
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#666666"/>
<size
android:width="120dp"
android:height="120dp"/>
</shape>
Use this code to draw a circle and put it as background of your TextView and make its android:gravity="center"
Change height and width according to your need.
Try following drawable
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item xmlns:android="http://schemas.android.com/apk/res/android">
<shape>
<solid android:color="#58050505" />
<corners
android:topLeftRadius="3dp"
android:topRightRadius="3dp"
android:bottomLeftRadius="3dp"
android:bottomRightRadius="3dp"
/>
</shape>
</item>
</selector>
Use this for the TextView background
inside drawable folder
badge_background.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:endColor="#color/purple"
android:startColor="#color/purple"></gradient>
<corners android:radius="100dp"></corners>
<stroke
android:width="0.5dp"
android:color="#color/white" />
</shape>
The TextView
<TextView
android:id="#+id/serial_no"
android:layout_width="22dp"
android:layout_height="22dp"
android:layout_gravity="top|start"
android:layout_marginTop="5dp"
android:background="#drawable/badge_background"
android:gravity="center|center_vertical"
android:maxLines="1"
android:text="1"
android:textColor="#android:color/white"
android:textSize="13sp"
android:textStyle="bold" />

Border effect to LinearLayout

I would like to get linearlayout border effect like the image below:
Is this possible? I don't wanna use one layout inside another layout. If so how do I do it?
I tried the following:
<corners android:radius="4dp" />
<stroke
android:width="4dp"
android:color="#color/layoutcolor_net" />
<gradient
android:endColor="#BDBDBD"
android:gradientRadius="250"
android:startColor="#E0E0E0"
android:type="radial" />
<padding
android:bottom="30dp"
android:left="30dp"
android:right="30dp"
android:top="30dp" />
I apply the gradient properly but my text is not shown.
I am applying this to relativeLayout:
<RelativeLayout
android:id="#+id/receivedLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".33"
android:background="#drawable/gradientShow"
android:gravity="center" >
<ImageView
android:id="#+id/receivedImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#drawable/recieved"
android:paddingTop="5dp" />
<TextView
android:id="#+id/receivedText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/receivedImage"
android:gravity="center"
android:paddingTop="5dp"
android:text="#string/transaction_received"
android:textSize="14sp" />
</RelativeLayout>
Thanks!
you should checkout the 'shape drawables' section of the reference guide.
http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape
There are lots of things you can do with shapes. For example:
<shape
android:shape="rectangle">
<gradient
android:startColor="#FFFF0000"
android:endColor="#80FF00FF"
android:angle="45"/>
<padding android:left="7dp"
android:top="7dp"
android:right="7dp"
android:bottom="7dp" />
<corners android:radius="8dp" />
save that file as res/drawables/gradient.xml folder and refer to it like this in a textview or some other view:
<TextView
android:background="#drawable/gradient"
android:layout_height="wrap_content"
android:layout_width="wrap_content" />

want to create modify button in android

I am new to Android development, i want to create a button, but i don't know how i create this button, i searched on 'google' but failed to create.
I created a button, But don't know i change this to like above image.
here is code:-
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item><layer-list>
<item android:top="5dp"><shape>
<corners android:radius="3dp" />
<solid android:color="#3366ff" />
</shape></item>
<item android:bottom="2dp" >
<shape>
<gradient android:angle="270" android:endColor="#E2E2E2" android:startColor="#3366ff" />
<stroke android:width="1dp" android:color="#3366ff" />
<corners android:radius="4dp" />
<padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
</shape></item>
</layer-list></item>
</selector>
and button is:-
<Button
android:id="#+id/button2"
style="#style/btnStyleOrange"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/SyncButton"
android:layout_centerHorizontal="true"
android:layout_marginBottom="30dp"
android:text="Watch Ad"
android:textColor="#android:color/white"
android:textColorHint="#android:color/darker_gray"
android:textSize="24sp" />
try this link it will help you to create custom button.
http://angrytools.com/android/button/
all you have to do is save the button.xml file in your drawable folder and then set your button background as
android:background="#drawable/button.xml"
You need to add your above btnStyleOrange.xml file in drawable folder and add it like this
<Button
android:id="#+id/button2"
android:background="#drawable/btnStyleOrange"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/SyncButton"
android:layout_centerHorizontal="true"
android:layout_marginBottom="30dp"
android:text="Watch Ad"
android:textColor="#android:color/white"
android:textColorHint="#android:color/darker_gray"
android:textSize="24sp" />
add to your button
android:background="#drawable/btnStyleOrange"

Adding icon next to button text in android

I used this button generator. http://angrytools.com/android/button/
Is there an easy way to add an icon to the left of the text.
The drawable
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<corners
android:radius="10dp"
/>
<gradient
android:angle="90"
android:startColor="#cacaca"
android:endColor="#FBFBFB"
android:type="linear"
/>
<padding
android:left="50dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="600dp"
android:height="60dp"
/>
<stroke
android:width="2dp"
android:color="#9f9f9f"
/>
</shape>
The button
<Button
android:id="#+id/angry_btn"
android:text="button"
android:textColor="#000000"
android:textSize="18sp"
android:layout_width="600dp"
android:layout_height="60dp"
android:background="#drawable/buttonshape"
android:shadowColor="#A4A4A4"
android:shadowDx="2"
android:shadowDy="3"
android:shadowRadius="5"
/>
Use android:drawableLeft attribute in the Button XML.
use 'android:drawableLeft="#drawable/userImage"' or 'android:drawableRight="#drawable/user_image"' in Button xml attribute
Try this wount really fail
<Button
android:id="#+id/fab"
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#color/btn_registration_login"
android:text="LOGIN"
android:paddingLeft="125dp"
android:paddingRight="125dp"
android:textColor="#color/white"
android:drawableRight="#drawable/ic_navigate_next_white_18dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"/>

Categories

Resources