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"
Related
There is a button with name "A" without any gravity. So A is at the left side. I want to set another text at the center of this button without changing string "A" and its place? How can I do that?
Sorry for my english hope you understand.
I think you cannot do that within a single button but you can make a RelativeLayout that will look like a Button, and then set the different TextView for different characters.
In that case your code should look like this
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="A" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="New Text" />
</RelativeLayout>
and also you can create a selector and apply it to RelativeLayout to achive the effect of a button.Follow this https://stackoverflow.com/a/14024007/3789993
Hope that helps
The easiest way to do it, but not recommended is just add white spaces after "A":
<Button
android:layout_width="WidthThatYouWant"
android:layout_height="HeightThatYouWant"
android:text="A TextYouWantToAdd"
/>
And the best way to do it, and recommended, is create a Layout that looks like a button:
<RelativeLayout
android:layout_width="WidthThatYouWant"
android:layout_height="HeightThatYouWant"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="A" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextYouWantToAdd"
android:layout_centerHorizontal="true" />
</RelativeLayout>
Then you can customize the LinearLayout to have the same format that your button, adding this:
android:background="#drawable/circularRedButton.xml"
For example here, is a button red and circular.
The file circularRedButton.xml is:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false">
<shape android:shape="rectangle">
<corners android:radius="1000dp" />
<solid android:color="#ff0000" />
<stroke
android:width="2dip"
android:color="#c20000" />
<padding
android:bottom="4dp"
android:left="4dp"
android:right="4dp"
android:top="4dp" />
</shape>
</item>
<item android:state_pressed="true">
<shape android:shape="rectangle">
<corners android:radius="1000dp" />
<solid android:color="#ff0000" />
<stroke
android:width="2dip"
android:color="#c20000" />
<padding
android:bottom="4dp"
android:left="4dp"
android:right="4dp"
android:top="4dp" />
</shape>
</item>
</selector>
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">
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.
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"/>
i need to create a login screen in android that will look like this.
I have white rectangle image but that image is bigger than screen.
So whenever i am applying that image to linearlayout(that has edittext and button).linearlayout fills complete screen.
I know its a very beginner question but how can i make this screen?
and i also want that that white image should work on every
You need to create some drawables (XML), 1 for the background (so you can add the round corners) and another 1 for the button where you will add the gradient and stroke.
EDIT: Added an example.
Result:
Layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#d4d4d4" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginTop="15dp"
android:background="#drawable/round_borders"
android:orientation="vertical"
android:paddingTop="40dp" >
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:paddingBottom="0dp"
android:paddingTop="0dp"
android:singleLine="true"
android:text="username" />
<EditText
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:paddingBottom="0dp"
android:paddingTop="0dp"
android:singleLine="true"
android:text="password" />
<Button
style="#style/OrangeButtons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:gravity="center"
android:paddingBottom="3dp"
android:paddingTop="3dp"
android:text="Log in" />
</LinearLayout>
</RelativeLayout>
#style/OrangeButtons
<style name="OrangeButtons">
<item name="android:gravity">center</item>
<item name="android:textColor">#FFFFFF</item>
<item name="android:focusable">true</item>
<item name="android:background">#drawable/orange_button</item>
</style>
#drawable/orange_button
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<gradient
android:startColor="#f29d00"
android:endColor="#d96c00"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#fade96" />
<corners
android:radius="15dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item android:state_focused="true" >
<shape>
<gradient
android:endColor="#f29d00"
android:startColor="#d96c00"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#fade96" />
<corners
android:radius="15dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:endColor="#f29d00"
android:startColor="#d96c00"
android:angle="90" />
<stroke
android:width="1dp"
android:color="#fade96" />
<corners
android:radius="15dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
#drawable/round_borders
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#android:color/white" />
<padding android:left="20dp" android:top="35dp"
android:right="20dp" android:bottom="15dp" />
<corners android:radius="8dp" />
</shape>
You can set layout background to white `android:background="#FFFFFFFF" or something like that.
You can also have a look at shape drawables http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape, use something like solid in your xml