Remove image after loading screen with animation, Android - android

I'm trying to show a splash screen between activities. For this I'm using a handler that loads an ImageView then sets the visibility to GONE after a certain amount of time.
I wanted to make it a bit more fancy and animate it with a loadAnimation. The problem I'm running into is once the handler ends the animation stops but does not remove the loading image from the screen. Instead it is just placed as a background for the whole activity.
I would like to know how to remove the splash image after the handler stops.
Below is my code:
private static final long SPLASHTIME = 3000;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main)
ImageView splash = (ImageView)findViewById(R.id.splashscreen);
final Animation a = AnimationUtils.loadAnimation(getBaseContext(),R.anim.progress_anim);
a.setDuration(1000);
splash.startAnimation(a);
new Handler().postDelayed(new Runnable(){
#Override
public void run() {
a.cancel();
splash.setVisibility(View.GONE);
}
}, SPLASHTIME);
}
XML for splash image:
<ImageView
android:id="#+id/splashscreen"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/loading_circle"
android:layout_gravity="center"
/>

Just declare splash globally and not in oncreate().

i think you need to add visibility :gone in XML:ImageView
and make imageview INVISIBLE

You need to add
a.setFillAfter(true);
to the end of your code inside your Runnable.

Related

how to send the front image view to the end of elements and so on for framelayout elements android

I have create a new layout which is type of FrameLayout and I have added four elements of image view I want to take the first image view to the end programmatically
in short reorder the elements of framelayout programmatically. suppose we do that listen to button clickListener
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/framelayout">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#mipmap/a20141008_091817"
android:id="#+id/i1"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#mipmap/a20141008_091819"
android:id="#+id/i2"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#mipmap/a20141008_091821"
android:id="#+id/i3"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#mipmap/a20141008_091823"
android:id="#+id/i4"/>
</FrameLayout>
I appreciated any help.
In this case, it seems you want to re-order the child-views of the FrameLayout. I'd suggest you simply use the ViewGroup, and use getChildAt(some-index), addView(viewToAdd, index-to-place-it) as well as removeViewAt(some-index) to achieve the re-ordering; In my suggested solution - I assume the layout won't change (this can be improved):
ViewGroup viewGroup = (ViewGroup)this.findViewById(android.R.id.content).getRootView();
int first = 0;
int second = 1;
int third = 2;
int fourth = 3;
View view1 = viewGroup.getChildAt(first);
View view4 = viewGroup.getChildAt(fourth);
viewGroup.removeViewAt(first);
//move fourth to first
viewGroup.addView(view4, first);
viewGroup.removeViewAt(fourth);
//move first to fourth
viewGroup.addView(view1, fourth);
View view2 = viewGroup.getChildAt(second);
View view3 = viewGroup.getChildAt(third);
viewGroup.removeViewAt(second);
//move third to second
viewGroup.addView(view3, second);
//move second to third
viewGroup.removeViewAt(third);
viewGroup.addView(view2, third);
I hope this helps you and others. You can also checkout the selected answer in this closely related question and this one, and the selected answer here shows how to re-order views.
first of all. Thanks so much for every one try to help me.
then i figure out my problem in good practice way and I wish to share it with you may any one will need it in future.
the steps
create a frameLayout as in the xml in my question
add your image into frameLayout
create a java file and connect it to the xml
we must to know the ids of all the images into the framlayout
create a timer which will change the order of image in X seconds
get the count of all the images into the framLayout
create Intager var which will determine which is next of image to bring to front
still calling the timer to work in x times as i mentioned
create method to stop the timer if we want in my case I stop the timer in the onPause() method
this is the java file which will do all the above steps. wish it help any one
public class FrameLayout5 extends AppCompatActivity {
FrameLayout frameLayout;
Handler handler; // this class will work as timer for change the order of images in delay
List<Integer> views; // this Array list will store all the ids of all the ImageViews into framelayout
int counter; // this counter will help us to find the next element to bring it to front
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_frame_layout5);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
frameLayout = (FrameLayout) findViewById(R.id.framelayout);
handler = new Handler();
views = new ArrayList<Integer>();
counter=0;
// get all the children of framelayout
for (int i = 0; i < frameLayout.getChildCount() ; i++) {
views.add(frameLayout.getChildAt(i).getId());
}
handler.postDelayed(runnable, 1000); // 1000 mean that this method will excute every 1 second
}
Runnable runnable = new Runnable() {
#Override
public void run() {
int i=counter%(frameLayout.getChildCount());
counter++;
ImageView a = (ImageView) findViewById(views.get(i));
frameLayout.bringChildToFront(a);
handler.postDelayed(runnable, 1000);
Log.d("run", "called "+i);
}
};
#Override
protected void onStop() {
super.onStop();
handler.removeCallbacks(runnable);
}
}
#ExpensiveBelly
#ishmaelMakitla
What about changing the visibility of the ImageViews to invisible/gone so you just display the one you want to show?

Animate change of view background not happening smoothly

I am trying to animate the back ground of my activity
What i have done is
ImageView image = (ImageView) findViewById(R.id.toggle_image);
final TransitionDrawable td = new TransitionDrawable( new Drawable[] {
getResources().getDrawable(R.drawable.welcomeimagetoggle1),
getResources().getDrawable(R.drawable.welcomeimagetoggle2)
});
image .setImageDrawable(td);
td.startTransition(3000);
td.reverseTransition(3000);
final Handler handler = new Handler();
handler.postDelayed(new Runnable() {
#Override
public void run() {
//Do something after 100ms
td.startTransition(3000);
td.reverseTransition(3000);
handler.postDelayed(this, 3000);
}
}, 3000);
It's working properly but the problem is while the timer ends the change happening is to smooth , there is a sudden movement. How can i avoid that ?
I think you should use this library (DexMovingImageView) instead.
It offers some cool transitions (check their demo). In your case, use the DexCrossFadeImageView with multiple images.
Don't forget to make the window background of your activity transparent to avoid overdraw.
UPDATE : About the padding, check the scaletype. As for animation, here's KenBurnsView (ImageView animated by Ken Burns effect), Motion (ImageView with a parallax effect that reacts to the device's tilt) and finally LoyalNativeSlider (An image slider with many cool animations). Hope this helps!

Android Transitions (API 19) - How to setText() on TextView before transition?

I am animating a TextView using android's API19 transitions. I defined a scene that i wish to transition to:
scene = Scene.getSceneForLayout(rootLayout, R.layout.my_scene, this);
I defined my transition:
myTransition = new ChangeBounds();
myTransition.setDuration(1000);
myTransition.setInterpolator(new BounceInterpolator());
And I begin transition:
TransitionManager.go(scene, myTransition);
Everything works as long as I have the android:text hardcoded. Here is what my_scene.xml looks like:
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="#+id/textview1"
android:layout_width="100dp"
android:layout_height="100dp"
android:text="text1"/>
</merge>
An identical TextView with the same id is in activity_main.xml, but in a different position.
When I try to set the text dynamically using setText() it will not change the text. I am not very experienced with this transition API so any help is appreciated.
Define the scene enter action and then call the go() method in TransitionManager. Here is the code snippet
scene = Scene.getSceneForLayout(rootLayout, R.layout.my_scene, this); scene.setEnterAction(new Runnable() {
#Override
public void run() {
TextView textView1 = (TextView)rootLayout.findViewById(R.id.textView1);
textView1.setText("Hello World");
}
}); TransitionManager.go(scene, myTransition);
What if you try to delay the transition via the TextView's event queue?
final Scene scene = Scene.getSceneForLayout(rootLayout, R.layout.my_scene, this);
final ChangeBounds myTransition = new ChangeBounds();
myTransition.setDuration(1000);
myTransition.setInterpolator(new BounceInterpolator());
TextView tv;
tv.setText("Some text");
tv.post(new Runnable() {
#Override
public void run() {
TransitionManager.go(scene, myTransition);
}
});
You may try having an initial scene by initializing a Scene variable scene one and using enter() to set the initial scene.
Then, you can transition from scene1 to scene2, your target scene. Above that, I've also noticed some lag during the change of text from scene1 to scene2. In order to counteract that, I utilized the TransitionListener class to detect when the scene was finished transitioning. Then, I altered the text using setText() after the transition.

Changing background image periodically ImageView

I have layout FrameLayout as a root layout.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ImageView
android:id="#+id/background_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/init_image"
android:scaleType="centerCrop">
</ImageView>
......
......
</FrameLayout>
I need to change periodically some amount of images in a infinity loop (some condition) so like slideshow.
I have tried to use Handler but when I change I get OutOfMemory error.
I also tried ImageSwitcher but It seems not to work correctly.
Please give an example or advice how to implement it correctly following all design patterns of Android, thx.
Hye there , i was recently searching for this issue and came across a good solution as it doesn't apply automatic density based scaling of the images and use them as they are.
1- Put all your images in res/drawable-nodpi folder, you have to create this folder as it doesn't exist.
2 - Make them automatically change from one to other in an infinite loop.
int images[] = { R.drawable.background_1,
R.drawable.background_2,
R.drawable.background_3,
R.drawable.background_4,
R.drawable.background_5,
R.drawable.background_6,
R.drawable.background_7 }; // i've these images in **res/drawable-nodpi**
Here is the onCreate method
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = (ImageView) findViewById(R.id.imageView_Animated);
handler.postDelayed(changeImage, 5000); // after every 5secs it will change image.
}
Now here comes the part which handles all changing of images , outside onCreate do this.
Runnable changeImage = new Runnable() {
#Override
public void run() {
if (count >6) {
handler.removeCallbacks(changeImage);
} else {
if (count >= 6)
count = 0;
AlphaAnimation animation1 = new AlphaAnimation(0.5f, 1.0f); //here is a bit of animation for ya ;)
animation1.setDuration(5000);
animation1.setStartOffset(1300); //time for that color effect
animation1.setFillAfter(true);
imageView.startAnimation(animation1);
imageView.setBackgroundResource(images[count++]);
handler.postDelayed(changeImage, 5000);
}
}
};
All done, hope i helped you.

Set a gradient background

In my Activity I need to change an ImageView background using a gradient, so I use an image with a transparent area, changing its background when I need. Here's some code:
private static View myImage;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.myActivityLayout);
myImage = findViewById(R.id.myImageID);
}
[...]
private void myImageUpdate() {
GradientDrawable gradient;
int[] colors = {0xFF00FF00, 0xFF0000FF};
// I make some changes to these colors..
gradient = new GradientDrawable(GradientDrawable.Orientation.BOTTOM_TOP, colors);
myImage.setBackgroundDrawable(gradient);
}
Now, the problem is:
If I call myImageUpdate() within onCreate() method, everything works fine.
If I call myImageUpdate() from another part of the code (like an onClick callback), I can't set my backgroud!
* UPDATE *
Guys, this code is fine... I was calling my method in a wrong (not directly reachable) line! My apologies...
I don't think this will fix it since you said myImageUpdate gets called within onClick... but try this..
runOnUiThread(new Runnable() {
public void run() {
myImage.setBackgroundDrawable(gradient);
}
});
you might have to make gradient variable final..
final GradientDrawable gradient = new GradientDrawable(GradientDrawable.Orientation.BOTTOM_TOP, colors);
Try myImage.invalidate(). This will force the system to redraw the view.

Categories

Resources