I have a button in Android Studio:
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Event Name (23)" />
It looks like this:
-------------------------------------
| Event Name (23) |
-------------------------------------
What I would like is two pieces of text in a single button.
Basically, I want on the left side of the button, the name of an event... then I want on the right side of the button to have the number of people registered for the event, so it looks like this:
-------------------------------------
| Event Name (23) |
-------------------------------------
Is something like this possible?
I am completely new to Android, so keep that in mind.
You can create Layout instead of Button and Then perform click event on layout.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="15dp"
android:id="#+id/relLayout">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Event Name"
android:layout_alignParentLeft="true"
android:textSize="16sp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="(23)"
android:textSize="16sp"/>
</RelativeLayout>
In Activity :
RelativeLayout relLayout = (RelativeLayout) findViewById(R.id.relLayout);
relLayout.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
// Implement Your login on RelativeLayout click
}
});
pls try this
<RelativeLayout
android:id="#+id/btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ff0000"
android:padding="10dp"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="Event Name " />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="(23)" />
You can use a layout to show two text in it.And you can add the listener in the layout.
use spannable strings
String text;
SpannableString finalText = new SpannableString(text);
finalText.setSpan((new AlignmentSpan.Standard(Alignment.ALIGN_OPPOSITE), <start index of right String>, text.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
button.setText(finalText);
You can add a file named item_color_grey.xml in you drawable directory.The code is like this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#color/item_grey" />
<item android:state_focused="true" android:drawable="#color/item_grey" />
<item android:state_pressed="true" android:drawable="#color/item_grey" />
<item android:drawable="#color/white" />
</selector>
You can use the following way to do whatever you need.
in your layout define button like this :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:background="#drawable/lay_back"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Event Name"
android:layout_alignParentLeft="true"
android:textSize="26sp"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="(23)"
android:textSize="26sp"/>
And in Your drawable folder create a xml file lay_back.xml and write below code into it.
For ripple effect:(For Higher API levels)
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/white">
<item android:drawable="#color/item_grey"/>
</ripple>
For Selector Effect(Lower APIs) :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#color/white" />
<item android:state_focused="true" android:drawable="#color/item_grey" />
<item android:state_pressed="true" android:drawable="#color/item_dark_grey" />
<item android:drawable="#color/item_grey" />
</selector>
You can Give Any color stored in colors.xml of values directory.
Even if this post is pretty old. I've found a solution to it is by having Two buttons inside a relative layout.
Button1 having text left align (clickable=false) and stylesheet of a button.
Button2 having text right align (clickable=true) and stylesheet of a button; and having background transperent.
catch on the Activity Side, one will have to handle enable and disable state for both these button. While handling the click for the main button only.
Let me know if someone is look out for similar solution; in which case I can post the sample code.
Related
I have two buttons in bottom of screen, but how can I style stock buttons to style of my concept:
Here my code layout file:
<?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:orientation="horizontal">
<Button
android:id="#+id/button1"
android:layout_height="wrap_content"
android:layout_width="180sp"
android:text="Далее"
android:layout_weight="1"
android:layout_gravity="bottom"
android:layout_alignTop="#+id/button2"
android:layout_alignParentRight="true">
</Button>
<Button
android:id="#+id/button2"
android:layout_width="180dp"
android:layout_height="wrap_content"
android:text="Пропустить"
android:layout_weight="1"
android:layout_gravity="bottom"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true">
</Button>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Добро пожаловать!"
android:id="#+id/textView"
android:layout_marginTop="29dp"
android:fontFamily="sans-serif-thin"
android:phoneNumber="false"
android:textSize="33sp"
android:textColor="#color/text_color"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="25dp" />
</RelativeLayout>
There is multiple ways to do this when building an android application.
The first and simplest is to set your background to an image. To do this add a image to your drawable folders in the res folder, add the correct size images to each drawable folder to correct display across multiple platforms. Once you have imported your image simply put the following line in the layout xml for your button
android:background = "#drawable/imported_image"
The second is to create an selector android XML file. This will let you set the background image for different states of the buttons. I usually create a file under my res folder in my project called drawable and put the xml file there. The selector file would look something like this
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true" android:drawable="#drawable/large_button_on" />
<item android:drawable="#drawable/large_button_off" />
</selector>
the code to put in your Layout xml inside your button should be
android:background="#drawable/custom_button"
The final way without using any images is to define a shape android xml file for the button. This will instruct how you want the button to be drawn on screen. This xml should be placed in your project the same way we did with the other.
?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:startColor="#000000"
android:endColor="#0000ff"
android:angle="270" />
<stroke android:width="1dp" android:color="#ffffff" />
</shape>
again if you use this method put the following in your layout xml for your button
android:background="#drawable/custom_button"
Hope these methods of styling help.
You can create an drawable xml file like this and have a different drawable for the different states of you button
res/drawable/my_button_drawable.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_pressed"
android:state_pressed="true" />
<item android:drawable="#drawable/button_focused"
android:state_focused="true" />
<item android:drawable="#drawable/button_default" />
</selector>
Then in your button's declaration add the line:
android:background="#drawable/my_button_drawable" />
Android Developer Buttons
I have created a spinner which looks like
My layout file is:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/round_corners"
android:padding="7dip" >
<Spinner
android:id="#+id/select_city"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:prompt="#string/selectCity" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="14dp"
android:text="#string/City"
android:textColor="#color/dark_grey"
android:textSize="18dp" />
</RelativeLayout>
What I want is to make the background of the spinner transparent but still show the downward arrow. Is there any way that I can do this?
Create xml file and place it in drawable folder.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/slim_spinner_pressed" />
<item android:drawable="#drawable/slim_spinner_normal" />
</selector>
.
<Spinner ..... android:background="#drawable/selector_slim_spinner" ..... />
For more Information Check this Change Spinner Style In Android
You should create a slector and give that selector as background to your spinner
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/..." />
<item android:drawable="#drawable/..." />
</selector>
you can use this resource Android Holo Colors Generator to generate android components like Android 4.0
i want to make image button, so when it pressed i will replase the not-pressed image to pressed image of the button, and then go to other activity. i have two different images in drawable.
i have two xml files:
first one- load the main activity: background and image button
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/black"
android:orientation="vertical" >
<ImageButton
android:id="#+id/b1_l"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/s1"
android:scaleType="centerCrop"
android:background="#color/trans"
android:src="#drawable/b1_l" />
</RelativeLayout>
second one:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false"
android:drawable="#drawable/image_not_pressed" />
<item android:state_pressed="true"
android:drawable="#drawable/image_pressed"" />
</selector>
what is the code that i need to write in addition to my xml?
or can i pass the xml and write it only as code...?
thanks!
you need to usually have drawable for pressed and default(unpressed) state. You can have the xml file like this(below) for that. You need to put this xml file in the drawable folder and then use as src for ImageButton or background source in case of Button.
Lets name it is mybutton.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="true"
android:drawable="#drawable/your image name" />
<item android:state_focused="false" android:state_pressed="true"
android:drawable="#drawable/your image name" />
<item android:drawable="#drawable/your image name" />
</selector>
You layout file for main activity:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/black"
android:orientation="vertical" >
<ImageButton
android:id="#+id/b1_l"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/s1"
android:scaleType="centerCrop"
android:background="#color/trans"
android:src="#drawable/mybutton" />
</RelativeLayout>
You migth want do check out android developer guide on this
http://developer.android.com/guide/topics/ui/controls/button.html
I have a problem with changing button background image.
So i have 2 images (png-24 transparent background).
Images are a simple circle and the same circle but with some outerglow ).
I have the following code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ticketing_row_topup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#layout/pressed_topup_button"
android:orientation="horizontal" >
<TextView
android:id="#+id/topup_name"
android:layout_width="60dp"
android:layout_height="fill_parent"
android:gravity="center_vertical|right"
android:paddingRight="5dip"
android:paddingTop="22dip"
android:text="€"
android:textColor="#color/black"
android:textSize="35sp"
android:textStyle="bold" />
<TextView
android:id="#+id/topup_display_amount"
android:layout_width="90dp"
android:layout_height="match_parent"
android:gravity="center_vertical|left"
android:textSize="65sp"
android:textColor="#0d457f"
android:textStyle="bold" />
</LinearLayout>
And the pressed_topup_button.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" android:state_enabled="false">
<item android:state_pressed="true" android:state_enabled="true" android:drawable="#drawable/button_topup_glow" />
<item android:state_focused="true" android:state_enabled="true" android:drawable="#drawable/button_topup" />
<item android:state_enabled="true" android:drawable="#drawable/button_topup" />
</selector>
The LinearLayout is used to populate a GridView in each cell.
When i click the cell the behavior is correct (the glow is displayed) but also a yellow color is display on the corner of the image (where suppose to be transparent). How can i fix that?
Thanks
You need to add
android:listSelector="#android:color/transparent"
to your GridView declaration.
See this:
Android: Disable highlighting in GridView
I've scoured the interwebs and found many posts regarding how to change the colors of a list view using a list selector. However it does not seem to work for me. So my question would be what am I doing wrong?
When I use the below files I get a list where all item backgrounds are initially blue. (I expected white)
When I move the focus up and down the text just changes to a dark grey and the item backgrounds are still blue. (This is when I would expect a single row to be blue with the rest white)
When I click on a row the background of the row I clicked on turns black and all other rows turned green. (I expected to have the row I clicked turn green and the rest be white)
Here is my main layout file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ListView
android:id="#android:id/list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:listSelector="#drawable/item_selector"
/>
<TextView
android:id="#android:id/empty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/empty"
/>
</LinearLayout>
Here is my list item file:
<?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:orientation="horizontal"
android:padding="10sp">
<CheckBox
android:id="#+id/checkbox"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:focusable="false"
/>
<TextView
android:id="#+id/title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:textStyle="bold"
android:padding="7dip"
android:textSize="18sp"
android:layout_toRightOf="#id/checkbox"
/>
</RelativeLayout>
Here is my colors file:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="red">#ff00</color>
<color name="green">#f0f0</color>
<color name="blue">#f00f</color>
<color name="white">#ffff</color>
</resources>
Here is my selector file:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:drawable="#color/green" />
<item
android:state_focused="true"
android:drawable="#color/blue" />
<item
android:drawable="#color/white" />
</selector>
Hopefully it's something dumb and simple that I'm doing wrong.
Thanks in advance.
I think that android:listSelector="#drawable/item_selector" is applied only on the root of the view not at all his subchild.
Try to add #drawable/item_selector as a backgroud of your RelativeLayout with android:background="#drawable/item_selector" and put a transparent layout to the listSelector:
android:listSelector="#android:color/transparent"
Actually if you want to do it programatically without the use of resources, you can set your element color. For example, to set text color #F123456 in a TextView:
objTextView.setTextColor(color.parseColor("#F12345"));
This is handy if you want to dynamically set a color in a list view that is user selectable, perhaps stored in a database where you simply cant use a static resource file for color lists.