I created a custom drawable for a button and found that if I share the drawable between an array of button, any button I press within the array of button will cause the last button in the array to be appear to be pressed as well. Here is the code...
//xml code for stage button
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/stage_button_selected"></item>
<item android:state_pressed="false"
android:drawable="#drawable/stage_button_deselected"></item>
</selector>
//xml code for stage_button_selected
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:left="5dp" android:right="5dp" android:top="5dp"
android:bottom="5dp">
<shape android:shape="oval" android:innerRadius="5dp">
<solid android:color="#android:color/holo_blue_light"></solid>
<stroke android:color="#android:color/holo_blue_dark"
android:width="2dp"></stroke>
<corners android:radius="5dp"></corners>
</shape>
</item>
</layer-list>
//xml code for stage_button_deselected
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:left="5dp" android:right="5dp" android:top="5dp"
android:bottom="5dp">
<shape android:shape="oval" android:innerRadius="5dp">
<solid android:color="#android:color/white"></solid>
<stroke android:color="#dddddd" android:width="2dp"></stroke>
<corners android:radius="5dp"></corners>
</shape>
</item>
</layer-list>`
//android code
Drawable drawable = resources.getDrawable(R.drawable.stage_button, null);
for(int ctr=0; ctr<btnStage.length; ctr++){
GridLayout.Spec specRow = GridLayout.spec(specStage[ctr][0], 1);
GridLayout.Spec specCol = GridLayout.spec(specStage[ctr][1], 1);
GridLayout.LayoutParams lp = new GridLayout.LayoutParams(specRow,
specCol);
btnStage[ctr] = new Button(MainActivity.this);
btnStage[ctr].setBackground(drawable);
btnStage[ctr].setText("Stage " + stageNo(ctr));
btnStage[ctr].setWidth(btnWidth);
btnStage[ctr].setHeight(btnHeight);
final String temp = stageNo(ctr);
btnStage[ctr].setOnClickListener(MainActivity.this);
ss_gridLayout.addView(btnStage[ctr], lp);
}
The solution to the problem is to create an array of drawable for use of the array of buttons, however it doesn't make sense that I cannot share the drawable between the array of buttons without it causing an unwanted effect...
Related
In my app, I have the selector below.
Is possible to create a similar selector, by color instead of by image-drawable, but at runtime?
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_window_focused="false"
android:drawable="#drawable/ic_button_orange_normal" />
<item
android:state_pressed="true"
android:drawable="#drawable/ic_button_orange_pressed" />
<item
android:state_focused="true"
android:drawable="#drawable/ic_button_orange_focused" />
<item
android:drawable="#drawable/ic_button_orange_normal" />
</selector>
I have tried the function below to create the selector in runtime, but I need to create a round button, not square.
Is this possible?
private StateListDrawable makeSelector(int color)
{
StateListDrawable res = new StateListDrawable();
res.setExitFadeDuration(400);
res.setAlpha(45);
ShapeDrawable d = new ShapeDrawable();
res.addState(new int[] { android.R.attr.state_pressed }, new ColorDrawable(ColorUtilities.decrease(color, 0x003030)));
res.addState(new int[] {}, new ColorDrawable(Color.TRANSPARENT));
return res;
}
Edit again... I have found the way to create round selectors...
private static ShapeDrawable getRoundShapeDrawable(int color)
{
ShapeDrawable shape_drawable = new ShapeDrawable(new OvalShape());
shape_drawable.getPaint().setColor(color);
return shape_drawable;
}
public static StateListDrawable getRoundShapeSelector(int normal_color, int pressed_color)
{
ShapeDrawable normal_shape_drawable = getRoundShapeDrawable(normal_color), pressed_shape_drawable = getRoundShapeDrawable(pressed_color);
StateListDrawable state_list_drawable = new StateListDrawable();
state_list_drawable.addState(new int[] { android.R.attr.state_pressed }, pressed_shape_drawable);
state_list_drawable.addState(new int[] { android.R.attr.state_focused }, pressed_shape_drawable);
state_list_drawable.addState(new int[] { }, normal_shape_drawable);
return state_list_drawable;
}
You can use "StateListDrawable"
StateListDrawable
and add state in it.
Let me know if you face problem in implementing this.
If you want to create a round button. Then you can use layer-list then add this drawable xml as a Layer.
Eg. How to create round button.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:bottom="0dp"
android:left="0dp"
android:right="0dp"
android:top="0dp">
<shape android:shape="rectangle" >
<corners android:radius="40dp" />
<solid android:color="#fff" />
</shape>
</item>
<item
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp">
<shape android:shape="rectangle" >
<corners android:radius="40dp" />
<solid android:color="#d3d3d3" />
</shape>
</item>
<item
android:bottom="1dp"
android:left="2dp"
android:right="1dp"
android:top="2dp">
<shape android:shape="rectangle" >
<corners android:radius="40dp" />
<solid android:color="#EBEBEB" />
</shape>
</item>
<item
android:id="#+id/wl_btn_bg_shape"
android:bottom="6dp"
android:left="6dp"
android:right="6dp"
android:top="6dp">
<shape android:shape="rectangle" >
<corners android:radius="40dp" />
<solid android:color="#00caa8" />
</shape>
</item>
</layer-list>
create and save about code in drawable as wl_btn_bg.xml
Now you need to add this xml as view background
LayerDrawable layers = (LayerDrawable) context.getResources().getDrawable(R.drawable.wl_btn_bg);
view.setBackground(layers);
and if you want to change the color of selector then you need to add following lines in layers
LayerDrawable layers = (LayerDrawable) context.getResources().getDrawable(R.drawable.wl_btn_bg);
GradientDrawable shape = (GradientDrawable) (layers.findDrawableByLayerId(R.id.wl_btn_bg_shape));
shape.setColor(Color.parseColor("#ff6655"));
Done....
Here is the layer-list, named index.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:id="#+id/ll_23_1015_0" android:top="0dp" android:left="0dp" android:bottom="0dp" android:right="0dp">
<shape android:shape="rectangle">
<size android:width="1205dp" android:height="1795dp"/>
<solid android:color="#FFF"/>
</shape>
</item>
<item android:id="#+id/ll_23_1015_1" android:top="75dp" android:left="50dp" android:bottom="1366dp" android:right="919dp">
<bitmap android:src="#drawable/pic_23" />
</item>
<item android:id="#+id/ll_23_1015_2" android:top="504dp" android:left="50dp" android:bottom="937dp" android:right="919dp">
<bitmap android:src="#drawable/pic_23" />
</item>
<item android:id="#+id/ll_23_1015_3" android:top="933dp" android:left="50dp" android:bottom="508dp" android:right="919dp">
<bitmap android:src="#drawable/pic_23" />
</item>
<item android:id="#+id/ll_23_1015_4" android:top="1362dp" android:left="50dp" android:bottom="79dp" android:right="919dp">
<bitmap android:src="#drawable/pic_23" />
</item>
</layer-list>
and this is my code:
imgVShare = (ImageView) findViewById(R.id.imgVShare);
String path = "/storage/sdcard0/temp_photo.jpg";
Drawable finalPic = Drawable.createFromPath(path);
LayerDrawable myDrawable= (LayerDrawable)getResources().getDrawable(R.drawable.index);
for(int i=0; i<5; i++)
{
String ID = "ll_23_1015_" + (i+1);
int resID = getResources().getIdentifier(ID, "id", getPackageName());
Drawable layer = myDrawable.findDrawableByLayerId(resID);
layer = finalPic;
myDrawable.setDrawableByLayerId(resID, layer);
}
imgVShare.setImageDrawable(myDrawable);
All I want to do is to replace all bitmaps inside layer-list with "temp_photo.jpg" that is on internal storage. This method just replace the last bitmap and clear the rest.....please help....!
what i basically wanna do is this:
When i click on the button i want its Text color to appear in a different color.
What i tried is this:
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:color="#color/red" />
<item
android:state_pressed="false"
android:color="#000" />
</selector>
and then i did use this selector as drawable on the button android:textColor
but this doesn solve it since it only changes its color while i press the button.
I want it like this:
Default: black
on click: blue
on click again: black
any ideas how to do that? :S
this is my shape for the button (if it matters):
<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:insetBottom="-1dp"
android:insetLeft="-1dp"
android:insetRight="-1dp">
<selector>
<item android:state_pressed="false">
<shape android:shape="rectangle" >
<corners
android:radius="0dp"
/>
<solid
android:color="#color/background_grey"
/>
<padding
android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="100dp"
android:height="30dp"
/>
<stroke
android:width="1dp"
android:color="#ffb4b4b4"
/>
</shape>
</item>
<item android:state_pressed="true">
<shape android:shape="rectangle" >
<corners
android:radius="0dp"
/>
<solid
android:color="#color/pq_blue"
/>
<padding
android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="100dp"
android:height="30dp"
/>
<stroke
android:width="1dp"
android:color="#ffb4b4b4"
/>
</shape>
</item>
</selector>
</inset>
thx in advance
EDIT
so i tried to do it programatically and tied the folowing just to see if it changes color´s ..but yea..it doesn´t (it seems like my onCLick event doesnt work):
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.listview_item, container, false);
final Button likeButton = (Button)rootView.findViewById(R.id.btLike);
likeButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
String test = "tester";
if(BUTTON_STATE==BUTTON_STATE_ONCE){
likeButton.setTextColor(getResources().getColor(R.color.pq_blue));
BUTTON_STATE = BUTTON_STATE_TWICE;
}else{
likeButton.setTextColor(getResources().getColor(R.color.red));
BUTTON_STATE = BUTTON_STATE_ONCE;
}
}
});
return rootView;
}
}
NOTE: i do all tht stuff in onCreateView since im in a Fragment of my ActionBarActivity(with tabs) if im doing it in the onCreate i get a null pointer exception at findViewById ( since it searches for the ID in my mainActivity, if im right?)
so yea..any ideas?
Your textselector.xml -
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:color="#color/red" /> <!--selected text colour-->
<item
android:state_focused="true"
android:color="#color/red" />
<item
android:color="#color/blue" /> <!--unselected text colour-->
</selector>
Your button in layout.xml -
<Button
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Exit"
android:textColor="#drawable/textselector" <!-- SET textselector HERE -->
android:background="#drawable/button_color"/>
You can use this code to do it programmatically:
myButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
ColorStateList myList=myButton.getTextColors();
int myColor=myList.getDefaultColor();
switch(myColor)
{
case Color.BLACK:
myButton.setTextColor(Color.BLUE);
break;
case Color.BLUE:
myButton.setTextColor(Color.BLACK);
break;
}
}
});
If You want to have a behaviour like:
First Click: Button text black
Second Click: Button text blue
third Click: button text black again
I don´t think it´s possible with the selector, also not with state focused. Because if any other view will be clicked, the button is not focused anymore and will loose the textcolor, goes back to default. You have to do it in a programmatically way:
First, set the default textColor to what You want: black inside Your xml. So than You have the color on no press. make a globa variabel to save the state:
private int BUTTON_STATE = 0;
private final int BUTTON_STATE_ONCE = 0;
private final int BUTTON_STATE_TWICE = 1;
button.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View view) {
if(BUTTON_STATE==BUTTON_STATE_ONCE){
button.setTextColor(Color.BLUE);
BUTTON_STATE = BUTTON_STATE_TWICE;
}else if(BUTTON_STATE==BUTTON_STATE_TWICE){
button.setTextColor(Color.BLACK);
BUTTON_STATE = BUTTON_STATE_ONCE;
}
}
});
That´s just a possible solution, there are many ways..
EDIT
for Your code:
Create that global variables like i did in my example above, and use them in the if/else statement:
likeButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
if(BUTTON_STATE==BUTTON_STATE_ONCE){
likeButton.setTextColor(getResources().getColor(R.color.pqBlue));
BUTTON_STATE = BUTTON_STATE_TWICE;
}else if(BUTTON_STATE==BUTTON_STATE_TWICE){
likeButton.setTextColor(getResources().getColor(R.color.pqBlack));
BUTTON_STATE = BUTTON_STATE_ONCE;
}
}
});
Try adding text_effect.xml drawable
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:color="#color/white" /> <!-- pressed -->
<item android:color="#color/black" /> <!-- default -->
</selector>
add this line in button control
android:textColor="#drawable/text_effect"
It will work. Enjoy:)
If you do not mandatorily need a simple Button, you could use a ToggleButton that is made for binary-state handling... With a ToggleButton your selector would look like this :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#color/red" />
<!-- Default State -->
<item android:color="#000" />
</selector>
It seems like you wanna implement something like toggle button.
Instead of button u can use toggle button.
Though if you wanna use button only then u need to do some changes in your java code as well as xml code also
Create a file def_btn.xml it will look like this..
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:radius="0dp"
/>
<solid
android:color="#color/background_grey"
/>
<padding
android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="100dp"
android:height="30dp"
/>
<stroke
android:width="1dp"
android:color="#ffb4b4b4"
/>
</shape>
Create another file press_btn.xml it will look like this..
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:radius="0dp"
/>
<solid
android:color="#color/pq_blue"
/>
<padding
android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="100dp"
android:height="30dp"
/>
<stroke
android:width="1dp"
android:color="#ffb4b4b4"
/>
</shape>
Inside your activity declare a private boolean variable(say isPressed) by default isPressed is false. & for default button background will be def_btn.xml
Now write following in button's onClick event.
btn.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
isPressed = !isPressed;
if(isPressed){
btn.setBackgroundResource(R.drawable.def_btn);
}else{
btn.setBackgroundResource(R.drawable.press_btn);
}
}
});
That's it..
I make a circle button with states and I want to add shadow to the button like the default buttons how I can do this? Here is my code:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="#color/yellow_pressed" />
<stroke android:width="1dp" android:color="#fff" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="oval">
<solid android:color="#color/yellow_pressed" />
<stroke android:width="1dp" android:color="#fff" />
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#color/yellow_default" />
<stroke android:width="1dp" android:color="#fff" />
</shape>
</item>
</selector>
Starting from Lollipop, you can use:
public static void setOvalElevationToView(final View view) {
if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP)
view.setOutlineProvider(new ViewOutlineProvider() {
#TargetApi(VERSION_CODES.LOLLIPOP)
#Override
public void getOutline(View view, Outline outline) {
final int size = view.getWidth();
outline.setOval(0, 0, size, size);
}
});
}
You might also need to disable clipping on the parent of the view, so that the shadows won't be clipped
How to change text position for different button states?
On image you can see how its look like now:
drawable
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true">
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="4dp">
<shape android:shape="rectangle">
<solid android:color="#DCDBDB" />
<corners android:radius="7dp" />
<stroke android:width="1dp" android:color="#B1B1B1"/>
</shape>
</item>
<item android:bottom="4.5dp" android:left="1.5dp" android:right="1.5dp" android:top="5.5dp">
<shape android:shape="rectangle" android:gravity="bottom">
<solid android:color="#F2F1F1" />
<corners android:radius="6dp" />
<stroke android:width="1dp" android:color="#FFFFFF"/>
</shape>
</item>
</layer-list>
</item>
<item>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#DCDBDB" />
<corners android:radius="7dp" />
<stroke android:width="1dp" android:color="#B1B1B1"/>
</shape>
</item>
<item android:bottom="8.5dp" android:left="1.5dp" android:right="1.5dp" android:top="1.5dp">
<shape android:shape="rectangle">
<solid android:color="#F2F1F1" />
<corners android:radius="6dp" />
<stroke android:width="1dp" android:color="#FFFFFF"/>
</shape>
</item>
</layer-list>
</item>
</selector>
Few days ago I asked similar question - Android 3D button src padding, but for text I cant use this trick :/ (or dont know how).
You will need to create a custom Button and override the methods for changing it's state in order to customize it's gravity based on the current state.
For example here is the code for a custom Button whose text will jump to the bottom when it is pressed:
public class VariableGravityButton extends Button {
public VariableGravityButton(Context context) {
super(context);
}
public VariableGravityButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
public VariableGravityButton(Context context, AttributeSet attrs,
int defStyle) {
super(context, attrs, defStyle);
}
#Override
public void setPressed(boolean pressed) {
if (pressed != isPressed()) {
setGravity(pressed ? Gravity.CENTER_HORIZONTAL |
Gravity.BOTTOM : Gravity.CENTER);
}
super.setPressed(pressed);
}
}