android XML change gradient color - android

i need to change android:color in XML file in run-time
i use it for an image button source
<ImageButton
android:layout_width="#dimen/large_brush"
android:layout_height="#dimen/large_brush"
android:background="#android:color/transparent"
android:contentDescription="#string/paint"
android:src="#drawable/paint"/>
my XML paint file looks like this
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<stroke
android:width="1dp"
android:color="#android:color/holo_purple" />
<gradient
android:startColor="#android:color/holo_purple"
android:endColor="#android:color/holo_purple" />
<corners android:radius="10dp" />
</shape>
</item>
</layer-list>
i tried DOM parser but after getting to gradient it shows that there are no more nodes

Try like this way. Hope it should helpful for you. Thanks
Create a new xml file and put it in drawable and then add it to button as background
gradient.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- Gradient Bg for listrow -->
<gradient
android:startColor="#f1f1f2"
android:centerColor="#e7e7e8"
android:endColor="#cfcfcf"
android:angle="270" />
</shape>
layout.xml
<Button
android:id="#+id/Button1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#drawable/gradient"
android:text="Button Text" >

You have the background set to transparent, the button will never have a background. Set it to you XML drawabale resource instead.

Related

How do I create an ImageButton with a drawable src?

I have the following contents in a drawable called gray_button.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<size
android:width="300dp"
android:height="300dp" />
<solid android:color="#666"/>
</shape>
</selector>
In my app's main layout, I have the following section
<ImageButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:src="#drawable/gray_button"
android:layout_margin="160dp"
/>
Unfortunately, the button displays as a small rectangle instead of an oval.
I am fairly certain I have done something stupid.
How can I make my button display the drawable properly?
Update: Based on the given answer I've switched the drawable to the following but now it just displays as a large rectangle instead of an oval.
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<size
android:width="300dp"
android:height="300dp" />
<solid android:color="#000"/>
</shape>
The problem is your shape, you are using a selector with a duplicated URI, so remove the selector and use only the shape:
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<size
android:width="300dp"
android:height="300dp" />
<solid android:color="#666"/>
</shape>
With this approach you will see the rectangle because is the background button and your drawable as image.
Try to remove selector and margin android:layout_margin="160dp"
This should work:
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<size
android:width="300dp"
android:height="300dp" />
<solid android:color="#666"/>
</shape>
<ImageButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/gray_button"/>
I would recommend to try it on simple Button instead of ImageButton. If it still doesn't works, then probably the problem is in gray_button.xml file otherwise fine.

Edittext as spinner

I have a editext which I would like to show as drop down. SO for that I have background.xml file:
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<layer-list>
<item>
<shape>
<solid android:color="#ffffff" />
<stroke android:width="1dp" android:color="#000000" />
<padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
</shape>
</item>
<item>
<bitmap android:gravity="right" android:src="#drawable/ic_arrow_drop_down" />
</item>
</layer-list>
</item>
</selector>
And added that as background for my edittext. This is what I get:
As you can see there is slight gap between the image and editext border. I would like to make my edittext like this:
How can I achieve this?
Try this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bg"
android:orientation="horizontal">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:background="#drawable/bgnew"
android:src="#drawable/ic_android_black_24dp" />
</LinearLayout>
</LinearLayout>
Create bg.xml like this
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Background Color -->
<solid android:color="#ffffff" />
<!-- Border Color -->
<stroke android:width="1dp" android:color="#ff9900" />
</shape>
create a bgnew.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Background Color -->
<solid android:color="#ffffff" />
<!-- Border Color -->
<stroke android:width="1dp" android:color="#color/colorAccent" />
</shape>
Output
Create a RelativeLayout with EditText and ImageView UI Components :).
Don't complicate yourself.
Just try Linear layout with layout orientation horizontal of EditText and ImageView. It is simple.

How can I write a letter in my xml file?

Hello I have this triangle that I did with xml on Android Studio :
<item>
<rotate
android:fromDegrees="135"
android:pivotX="7%"
android:pivotY="65%" >
<shape
android:shape="rectangle" >
<solid
android:color="#color/blue" />
</shape>
</rotate>
</item>
And what I want is to put a letter at the right of the triangle. How can I do this ?
Thank you very much !
I don't think you can put text in the drawable itself.
What you could do is have your text as a text view and set its background as the drawable.
Or create a button and set its background to your drawable and set the text with the setText() method.
Something like this:
Make a triangle.xml and put it into your drawable folder:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<rotate
android:fromDegrees="135"
android:pivotX="7%"
android:pivotY="65%">
<shape android:shape="rectangle">
<solid android:color="#color/colorPrimary" />
</shape>
</rotate>
</item>
And then make an imageView, put the triangle as a background and a textView on its side all wrapped inside a linearLayout with orientation horizontal.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#drawable/triangle"/>
<TextView
android:text="A"
android:textSize="100dp"
android:includeFontPadding="false"
android:padding="0dp"
android:layout_width="100dp"
android:layout_height="100dp" />

How to make drawableshape in Android using xml?

I need to make the below shape using xml.
I have created an oval shape using below xml code.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- This is the line -->
<item android:height="400dp"><shape
android:shape="oval">
<solid android:color="#000000" />
</shape></item>
</layer-list>
But I am not able to draw a line and circle together. Please help me to make the above shape using xml.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#color/comment_background"/>
<stroke android:color="#color/gray" android:width="0.5dp"/>
</shape>
This is Code for Creating Circle shape in android
Finally I have come with a solution after little googling.
Followed steps:-
1.Created a xml file called dot.xml in drawable folder to draw a dot or filled circle.
//Dot.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval" >
<solid android:color="#color/colorTimeline" />
</shape>
2.Inserted below code into layout file.
<View
android:id="#+id/v1"
android:layout_width="1dp"
android:layout_height="50dp"
android:background="#color/colorTimeline"
android:contentDescription="ad"
android:layout_marginStart="10dp"/>
<View
android:id="#+id/v2"
android:layout_width="16dp"
android:layout_height="16dp"
android:background="#drawable/dot"
android:contentDescription="f"
android:layout_marginStart="3dp"
android:layout_below="#id/v1"
android:layout_marginEnd="24dp"/>
<View
android:id="#+id/v3"
android:layout_width="1dp"
android:layout_height="50dp"
android:background="#color/colorTimeline"
android:contentDescription="ad"
android:layout_marginStart="10dp"
android:layout_below="#id/v2"/>
Final Output :-
Output Screenshot
My eyes bleeding, when i see your solution, sorry. I had to create and show you this one. Remember this example works only for known size of view. If you want to use dynamic values create my example drawable programatically.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- VERTICAL LINE -->
<item
android:left="9dp"
android:right="9dp">
<shape
android:shape="rectangle">
<solid
android:color="#FF0000" />
<size
android:width="2dp"
android:height="200dp" />
</shape>
</item>
<!-- OVAL -->
<item
android:top="90dp"
android:bottom="90dp">
<shape
android:shape="oval">
<solid
android:color="#FF0000" />
<size
android:width="20dp"
android:height="20dp" />
</shape>
</item>
</layer-list>
If you need any explanation just let me know.

how to create a pointy button on android?

How can I create a pointy button like iPhone back button in Android XML ?
I want to create using like this
<?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="#f8bb49"
android:endColor="#f7941d"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#8c8382" />
<corners.....
Path and PathShape can build whatever you want. By layering a couple together and using a gradient fill you can create the 3D effect (recessed) effect.
However, you will need a class that you can use to create a drawable reference if you want to be able to use an XML definition. Sorry I have not worked out the exact code, but it's something I'm planning to do (which is how I found your question).
Looks like you have an image you can work with. Read the docs on 9-patches to set margins and resizable areas.
http://developer.android.com/guide/developing/tools/draw9patch.html
Create image like that and use ImageButton instead of Button
and , use this property for ImageButton
android:background="#drawable/createdimage"
I did this for the following back button
https://drive.google.com/file/d/0B1cySRpqElgyTkptOFpQa3NsdDQ
using the XML files:
left_arrow.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item >
<rotate
android:fromDegrees="-45"
android:toDegrees="-45"
android:pivotX="89%"
android:pivotY="-22%" >
<shape
android:shape="rectangle" >
<stroke android:color="#color/calendarOrange" android:width="3dp"/>
<solid
android:color="#color/drakBlue" />
</shape>
</rotate>
</item>
</layer-list>
button_body.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:left="-4dp">
<shape android:shape="rectangle" >
<stroke android:color="#color/calendarOrange" android:width="3dp"/>
<solid
android:color="#color/drakBlue" />
</shape>
</item>
</layer-list>
Getting them together:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:weightSum="1.0"
>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/left_arrow"
android:layout_weight="0.7"
>
</RelativeLayout>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/button_body"
android:layout_weight="0.3"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:textColor="#color/white"
android:text="Back"
android:gravity="center"
android:textStyle="bold"
android:textSize="22dp"
/>
</RelativeLayout>
</LinearLayout>
PS: You might need to change the android:pivotX and android:pivotY parameters depending on your conteiner layout

Categories

Resources