TransitionDrawable not changing the color as expected - android

I have the following in a class ProgressIndicatorView. The view, when used holds the five rectangles below :
When the user presses the button "Fortsæt" I call the views method setProgressIndicator(int step) which sets the color of the next rectangle in the view to fully opaque. The method looks like this :
public void setProgressIndicator(int activeStep) {
// Fade IN
TransitionDrawable transition = (TransitionDrawable) this.getChildAt(activeStep-1).getBackground();
transition.startTransition(transitionTime);
}
and the init method looks like this
private void init(Context context) {
this.setOrientation(LinearLayout.HORIZONTAL);
transitionColor = getResources().getDrawable(R.drawable.colortransition);
for (int i = 0; i < squareAmount; i++) {
ImageView loadingPiece = new ImageView(context);
//loadingPiece.setBackgroundColor(transparentWhite);
loadingPiece.setBackgroundDrawable(transitionColor);
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(0,
LinearLayout.LayoutParams.FILL_PARENT, 1.0f);
lp.setMargins(0, 15, 4, 15);
this.addView(loadingPiece, lp);
}
}
The method works perfectly if I use a static backgroundcolor as the resource but doesn't when I use the transitioncolor drawable. Any suggestions as to what could be causing the issue ?
edit: for clarification THIS is what the view looks like when I use this.getChildAt(activeStep-1).setBackgroundColor(opaqueWhite);
but THIS is what it looks like when I use the current implementation of setProgressIndicator:
What is causing this to happen?
edit: Is there another approach that I could possibly to accomplish this effect if the cause of this problem cannot be located?

Related

Change Background Image of button when scrolling in android

Sorry for not posting any code.
Searching on stackoverflow and google but could not find proper solution for this, so could you please help me out, if you have any idea or tricks for this.
Requirment:
I have many buttons create programmatically according to web's requirement.and set all button's background image with grayscale. I have done this part but when scrolling horizontal scollview then i want to change of that buttons(visible to that time when scrolling) background image colored( initial load grayscaled) and certain time let us assume 10 second buttons background set intial sate(grayscaled).
Main theme:
Change button background image when scolling on visiable view's
button. for cetain time interval(10 second).
`
Problem:
I could not get buttons current visible in horizontal view and change of that buttons background colored image(first time view load). All i want to this programmatically, because all images getting from server side.
Any idea , how could do this job or any references for this task.
Note:
I create button view and set image background and add images on linearlayout and add that linear layout other mainlinearlayout and add mainlinearlayout on horizontalview layout.
sample snipped of my code:
public class CustomAdWithTitle extends LinearLayout{
private LinearLayout LinearCollectionAds;
private List<CommericalClassifiedAds> listCommericalAds;
HorizontalScrollView commercialH = new HorizontalScrollView(mcontext);
commercialH.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
LinearLayout commercialL = new LinearLayout(mcontext);
commercialL.setOrientation(LinearLayout.HORIZONTAL);
commercialL.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));
LinearLayout LinearCollectionAds= new LinearLayout(mcontext);
LinearCollectionAds.setOrientation(LinearLayout.VERTICAL);
LinearCollectionAds.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,
LayoutParams.WRAP_CONTENT));
for (int i = 0; i < listCommericalAds.size(); i++) {
try {
commercialL.addView(listCommericalAds.get(i));
} catch (Exception e) {
// TODO: handle exception
e.printStackTrace();
}
}
commercialH.addView(commercialL);
LinearCollectionAds.addView(commercialH);
this.addView(LinearCollectionAds);
}
...............
list of CommericalClassifiedAds it could return relativelayout with buttonview. i just add button background only and set grayscaled here first time load view.
public class CommericalClassifiedAds extends RelativeLayout {
}
Let's see if I got you right. For changing the image behind buttons you can use a StateListDrawable
StateListDrawable stateList = new StateListDrawable();
stateList.addState(new int[] { android.R.attr.state_selected }, bitmapFromServer);
stateList.addState(new int[] {}, bitmapGrayScale);
Add it to the each CommericalClassifiedAds background when created instead of the buttons background. Register a Scroll listener to commercialH and update UI in it.
private static boolean wait;
private static Handler handler = new Handler();
private static Runnable delayRunnable = new Runnable() {
#Override
public void run() {
int childcount = commercialL.getChildCount();
for (int i=0; i < childcount; i++){
commercialL.getChildAt(i).setSelected(false);
}
};
#Override
public void onScrollChanged() {
//this method can be called very frequently so only run selective
if (!wait) {
handler.removeCallbacks(delayRunnable);
wait = true;
int childcount = commercialL.getChildCount();
for (int i=0; i < childcount; i++){
commercialL.getChildAt(i).setSelected(true);
}
handler.postDelayed(new Runnable() {
#Override
public void run() {
wait = false;
}
}, 2000);
handler.postDelayed(delayRunnable, 10000);
}
}
If it runs slow I would first rethink the layout structure. Looks like you have a couple more layouts than required and then optimize onScroll.
I'm leaving a reservation for errors, it's not tested but it can give you that idea of how to solve your problem.

How can I style Android tabs to get 3d look?

I want to create an Android tab view to look like this image:
I guess there are many ways to Rome, but I think I still haven't found the ideal one. My idea was to cut out a divider and an active divider and place them between the buttons. However, I don't know if this would be such a good solution because I still would need different styling for the first and last button. I already have a 9 patch for the surrounding (grey) container.
I've also thought about making a red 9 patch for the red bar, and than just style the selected button. The problem with this solution is that I'd still have to place the top diagonal white lines according to the number of buttons.
Does anyone have a better solution for me?
Here's another approach: to separate the header from the tabs. A bit complicated, yes, but the benefits are:
It allows you to define common tabs style;
Supports any number of buttons.
On this picture the buttons are of different width, so in reality an additional ImageView may be needed to the left of the header.
Let's create our header view as a LinearLayout. We can put upper dividers and stretchable gaps with the same layout_weight.
public class HeaderLayout extends LinearLayout {
public HeaderLayout(Context context) {
super(context);
initView();
}
public HeaderLayout(Context context, AttributeSet attrs) {
super(context, attrs);
initView();
}
public void setNumberOfColumns(int number) {
removeAllViews();
for (int i = 0; i < number; i++) {
addView(getColumnView(), getColumnLayoutParams());
// We don't need a divider after the last item
if (i < number - 1) {
addView(getDividerView(), getDividerLayoutParams());
}
}
}
private void initView() {
setBackgroundResource(R.drawable.header_bg);
}
private View getColumnView() {
return new View(getContext());
}
private View getDividerView() {
ImageView dividerView = new ImageView(getContext());
dividerView.setImageResource(R.drawable.header_divider);
dividerView.setScaleType(ImageView.ScaleType.FIT_XY);
return dividerView;
}
private LayoutParams getColumnLayoutParams() {
return new LayoutParams(0, LayoutParams.MATCH_PARENT, 1.0f);
}
private LayoutParams getDividerLayoutParams() {
return new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT);
}
}
Where R.drawable.header_bg is a 9patch:
And R.drawable.header_divider is a simple (optionally transparent) bitmap:
For me personally, making different background for the first and the last button is the least difficult solution, but it depends on the actual task.

Set onClickListener for custom view

I have created a custom view called Cell that draws a square. In my activity I create a 2d array of cells, hence giving a grid structure. Now the reason for this is, I want individual cells to respond to my clicks based on some value that they have. Say for eg, each cell has a boolean, and based on true of false I will color the cell.I tried doing this with one cell first. But the strange part is, the click event is triggered even when I click outside the cell.
More Information : I am creating all view in the onCreate method of the activity.
Let me know if you need more information.
Thanks in advance for your help !
Thought I will edit my original question for other references :) .
Activity
onCreate() {
super.onCreate(savedInstanceState);
LinearLayout masterLayout = new LinearLayout(this);
LinearLayout.LayoutParams params;
params = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.MATCH_PARENT);
masterLayout.setLayoutParams(params);
addCells();
setContentView(masterLayout);
}
function addCells() {
for(int i =0; i<2;i++) {
Cell cell = new Cell(this,i);
LinearLayout.LayoutParams viewParams = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.WRAP_CONTENT,
LinearLayout.LayoutParams.WRAP_CONTENT);
cell.setLayoutParams(viewParams);
masterLayout.addView(cell);
cell.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
//Do Something here
}
});}}
Custom View :
Cell extends View {
boolean flag=false;
int cellNumber;
float xCoordinate=50;
float yCoordinate=50;
Cell(Context context, AttributeSet attrs) {
super(context, attrs);
}
Cell (Context context, int i) {
super(context);
cellNumber = i;
}
onDraw(Canvas c) {
paint.setColor(Color.RED);
paint.setStrokeWidth(3);
paint.setStyle(Paint.Style.STROKE);
xCoordinate = xCoordinate + 40*cellNumber;
c.drawRect(xCoordinate,yCoordinate,xCoordinate+40,yCoordinate+40, paint);
}}
This is a much simpler version that I was trying out. Now the strange part is, though I am adding two different instances of my custom view, the onDraw() is called just once (on exiting the onCreate() of the activity). From what I read, the onDraw() is called for every new view render. Please enlighten me on that front !
Thanks a lot!
I suppose you are not setting the onClickListener to the proper layout. Its some how being set to the parent of the element you want. Please share your code for us to zero in on the exact problem.
the click event is triggered even when I click outside the cell.
Probably you somehow forward the touch events to your cell, at least it is receiving them. In the onTouchEvent() method of your view is decided whether it is a click (and fire the click listener) or long click or drag, etc.
However, please post some code if this didn't help you identify the problem.

Having trouble positioning android dynamically loaded buttons

I'm creating buttons dynamically in my class, I try to position them using 'offsetLeftAndRight()' or '.leftMargin' and '.topMargin' as follows,
public class instruction extends Activity {
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.instruct);
final Button btn = new Button(this);
RelativeLayout.LayoutParams paramsd2 =
new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
paramsd2.leftMargin = 500;
paramsd2.topMargin = 500;
paramsd2.height = 60;
paramsd2.width = 200;
btn.offsetLeftAndRight(300);
btn.setLayoutParams(paramsd2);
addContentView(btn, paramsd2);
}
But the button always stays in the top left corner, how can I position it, what am I doing wrong?
AddContentView() is not the proper way to add a view in an already set layout.
make your main layout a RelativeLayout (check this in the instruct.xml layout file)
use its id to retreive a reference on it in your onCreate() method using
myRelativeLayout = (RelativeLayout) this.findViewById(R.id.itsId)
then add your button to this layout :
myRelativeLayout.addView(myButton);
the layout params of your button seems fine for positioning so it should work.
Set margin on button rather then layout
MarginLayoutParams marginParams = new MarginLayoutParams(backToMainScreenImageView.getLayoutParams());
marginParams.setMargins(0, 0, (int) UIUtil.getRadialButtonMainMargin(this), 0);
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(marginParams);
layoutParams.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
backToMainScreenImageView.setLayoutParams(layoutParams);
Try something like this :
paramsd2.setMargin(500, 500, 0, 0);
btn.setLayoutParams(paramsd2);

Android: why isn't setPadding being respected?

I am trying to set the background of a Button to a PaintDrawable which I am creating in code. This works pretty well, but my Button appears larger than an android.view.Button.
In the below image, the first Button is an instance of MyButton, the second button is an instance of android.widget.Button.
I tried both setting the padding on the PaintDrawable and MyButton, but neither has any noticeable effect.
public class MyButton extends Button
{
PaintDrawable drawable = null;
public ColorButton(Context context)
{
super(context);
drawable = new PaintDrawable();
drawable.getPaint().setColor(Color.WHITE);
drawable.setCornerRadius(1);
//neither of these seem to do anything?
drawable.setPadding(10, 10, 10, 10);
setPadding(10, 10, 10, 10);
setBackgroundDrawable(drawable);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//set gradient in here, because getWidth/getHeight are useless prior to this
drawable.getPaint().setShader(new LinearGradient(getMeasuredWidth()/2, 0, getMeasuredWidth()/2, getMeasuredHeight(), Color.WHITE, Color.GRAY, Shader.TileMode.MIRROR));
}
}
Please note the difference between padding and margins
Padding determines how much "padding" is on the inside of your container.
Margins determine how much space to leave around the outside of your container.
Since you are setting the padding on an empty container you should see no visible results.
If you had something inside your container you may notice it getting squished as you increase your values
Try this in your code. It will only work on the button (your parent class)
//set your fill values to whatever you want
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
lp.setMargins(10, 10, 10, 10);
setLayoutParams(lp);

Categories

Resources