I would like the user to be able to click on the screen.
On click, I would like entire screen to turn opaque slowly.
Then I would like to display some buttons on the opaque screen.
What is the best way to achieve this effect?
Thanks.
You could fade in a dialog with an opaque background.
Then just set a custom view that contains your buttons on the dialog.
Here are some options I found
ViewSwticher
CrossFade
edit
I found this method to be ideal for cross-fading layouts.
You can simply change the alpha level of the activity's background in order to give it an opaque effect.
View backgroundimage = findViewById(R.id.my_activity);
Drawable background = backgroundimage.getBackground();
background.setAlpha(50);
To make it appear to "fade out", you could easily implement this into a for loop, allowing the thread to sleep for a short time between intervals to create an animated effect.
Here is a quick design of what this function might look like:
void fadeView(View v, int threshold, int speed) {
Drawable background = v.getBackground();
for (int i = 100; i < threshold; i--) {
background.setAlpha(i);
Thread.sleep(speed);
}
}
Related
i used below single line code for animation to my image view in android.
Coding
v.animate().translationXBy(1000).setDuration(5000).start();
but i hides the image. i don't want to hide my image using the above source. any helps are much welcome thanks.
Try this:
v.bringToFront();
Add this before animating.
Hope this helps
how do you want to hide your image?
you can also hide it by set 0 in alpha attribute
v.animate().alpha(0).setDuration(500).start();
EDIT
To move the view right to left without hide it at the end
You can try to use v.animate.x() instead
Set the min X Position, its 0 since you want to move it to left without goes out of screen
int minXPosition = 0;
Set the value how much the view move and calculate the view new X position
int moveXBy = 100;
int newXPosition = (int)view.getX()-moveXBy;
Animate the view, but check the position first -> if its past your minXPosition, use the minXPosition instead
view.animate()
.x(newXPosition<minXPosition?minXPosition:newXPosition)
.setDuration(500)
.start();
I'm trying to make a circle of one color on a background of another.
background = new ShapeDrawable(new OvalShape());
background.getPaint().setColor(main.getResources().getColor(R.color.XXX));
view.SetBackground(background);
will work for the colored circle, and
view.setBackgroundColor(getResources().getColor(R.color.XXX));
will work for the background, but they're mutually exclusive. It just ends up with what I did last. Is there a way to make the circle on another overlapping view or something like that?
setBackgroundColor() is basically a short cut for changing the view's background to a colour drawable.
To do what you want you could try one of the 2 things described below:
Put a view in a FrameLayout, set the background colour in the FrameLayout, and put the shape in the view.
You could also try to use ImageView, which can have a background and another drawable with setImageDrawable() method.
I am just planning to implement a view whose border color keeps on changing dynamically at run time based on a timer. For example initially the view's border will be in green color(timer=20sec) and every sec the green color disappears and once it goes of more than half(timer=10sec) of the view... the border color should change to orange and once it reaches the end(timer=5sec) of timer it should be in red color and phone should vibrate (easy can be done).... If somebody is familiar with zynga poker its the same that i want to implement.
Now one way of implementing it could be have a backend timer and based on that have "n" number of drawables and keep on changing the background of the view every sec. But this requires many images and i dont think this is the optimal way of implementing it.
just wondering if i can write a custom view and implement the surface view and do something around it so that this can be done. Anybody has any idea on how to achieve this? can this be done using any animations around customviews? Any ideas around this are greatly appreciated.
Thanks in advance
Run a timertask, and change the border of the view by setting the background value of the view to a style.
Like,
view.setBackground(R.drawable.border_style_green);
So in the timer task, keep checking the time, and change the border.
Note - border_style_green is a XML file which has the style where you can set the border, the rounded corner to a view, etc.
My suggestion is to make use of the animation framework from android. If your app targets versions below honeycomb use NineOldAndroids.
As already suggested set the border by assigning shapeDrawable to your view
view.setBackground(R.drawable.border_style_green);
you start the animator like this. (this code will animate from currentColor to red in 1000ms)
ObjectAnimator animator = ObjectAnimator.ofFloat(this, "color", currentColor,Color.RED);
animator.setEvaluator(new ArgbEvaluator());
animator.setDuration(1000);
animator.start();
Then in your activity implement:
public void setColor(int color){
currentColor = color;
view.getBackground().setColorFilter(color, PorterDuff.Mode.MULTIPLY);
}
if view is html page : Use Jquery for this implementation. by ajax you can call backend as well. Jquery delay function
I have a set of RadioButtons with a custom style. I want to display a border around the button that is currently checked. This should be easy enough using XML, but now I want the border to be animated. If a new radio button is checked, the border should "fly" to its new location with a fancy animation:
+------+
|* btn1| o btn2
+------+
+------+
o b|n1 * |tn2
+------+
+------+
o btn1 |* btn2|
+------+
Because of this, I decided to make the border into a separate View object, so I can animate it properly. The trouble is in tracking the location of the corresponding radio button on the screen.
I'm trying to get it to work without animations first. My current attempt looks something like this (only showing the relevant attributes):
<RelativeLayout
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true">
<RadioGroup
android:id="#+id/radio_group">
<RadioButton/>
<RadioButton/>
<RadioButton/>
</RadioGroup>
<View
android:id="#+id/selection_border"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"/>
</RelativeLayout>
In the OnCheckedChangeListener of the RadioGroup, I move the selection border around by setting its margin (I could set the position, but that's a little harder with a RelativeLayout):
View radioButton = findViewById(checkedId);
View selectionBorder = findViewById(R.id.selection_border);
ViewGroup radioGroup = (ViewGroup)findViewById(R.id.radio_group);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(selectionBorder.getLayoutParams());
params.leftMargin = radioGroup.getLeft() + radioButton.getLeft();
params.topMargin = radioGroup.getTop() + radioButton.getTop();
selection.setLayoutParams(params);
selection.requestLayout();
Trouble happens, however, on initialization. Because no layouting has been done yet, the position of the border is set incorrectly. It doesn't seem to be possible to force a relayout immediately, and it also doesn't seem to be possible to get an event after layouting has been done.
All this hassle leads me to believe that there must be a cleaner way to accomplish what I want. Any bright ideas?
best way I think is the treat check box as an image. Two types checked/not checked. Then you are basically moving an image across the screen. Handle everthing with TouchEvents and images if user mouse downs with the region radious of image you know they have selected. This is easy because now you are just dealing with images, a canvas and stardard x,y coordinates.
To address your trouble with initialization (I've had much trouble in the past with this myself): If I need to know when a view's layout is complete, I give it a runnable in Activity.onCreate() then call that runnable from View.onSizeChanged(). I've come to use this pattern quite a bit and I've found it very reliable. You just need to remember to only call the runnable from onSizeChanged() if the new width and height are greater than 0 and if they are not equal to the old width and height.
So in your activity:
public void onCreate() {
...
yourView.setLayoutRunnable(new Runnable() {
#Override
public void run() {
//do post-layout stuff...
}
});
...
}
and in your view:
public Runnable layoutRunner;
public void setLayoutRunnable(Runnable runner) {
layoutRunner = runner;
}
#Override
public void onSizeChanged(int w, int h, int oldw, int oldh) {
if (w > 0 && h > 0 && (w != oldw || h != oldh)) {
if (layoutRunner != null) layoutRunner.run();
}
}
If you have multiple views that all need to have their layouts finished before you do your stuff, you have to keep a count as you get the notifications so you know when they're done.
And regarding your topic in general, I implemented something similar to your radio button concept in a game I wrote, but I decided to override View from scratch to do it. I had all options for a set in a single view, so really I replaced the RadioGroup view rather than the RadioButton view. Each option had a value and an extent. I always used text, but images would work just as easily. Then I just tracked the taps and drags relative to the extents of the options and moved the "selector" on a timed handler (a la animations in javascript).
Is there a way to force an android view to redraw it's background?
I have set a drawable shape with a gradient as background which works fine but after changing the view's height you can see those ugly gradient steps.
What can I do?
I tried view.invalidate() and view.refreshDrawableState() without any visible difference.
Thank you!
//EDIT:
Here are some more details and my code:
After your answers I think the banding is a result of my probably bad code. Here is what I'm doing:
Scaling a view
setting its new width and height because the scaled view does not accept user input in other areas then the "old" one (see android weird (at least for me) behaviour of control after scaling / doesn't accept input in it's whole area )
trying to set the background again (which contains a gradient and a rectangle with rounded corners)
Here is my code:
public void onAnimationEnd(Animation animation)
{
MyView view = (MyView) ((ExtendedScaleAnimation) animation).getView();
view.getLayoutParams().width = toWidth;
view.getLayoutParams().height = toHeight;
view.clearAnimation();
view.requestLayout();
view.refreshBackground(); // background will be changed
}
On the device you can see that the background drawable is changed but there is a flickering which seems to me like the backround change is applied before the animation is over. Programatically it should be over! Or am I wrong?
Thank you again!
Can you try after resize:
v.setBackgroundResource(null);
v.setBackgroundResource(...my drawable...);