I am trying to make an animation with a layout which contains a background and some text (TextViews) inside it. The animation should make the whole layout crack in the middle and then move slightly like a paper tearing. So not along a straight line but a random zig-zag pattern along the middle of the layout from top to bottom.
I've been trying to find something like this so can I get an idea how to do this but have not been able to so far. Does anyone know how something like this can be done on Android?
TIA
You can try Brokenview Or ExplosionField.
Brokenview(https://github.com/zhanyongsheng/BrokenView).
ExplosionField(https://github.com/tyrantgit/ExplosionField).
Have you tried with this example? In the blog you have an explanation of how to achieve this behavior.
The idea behind is basically:
Save your Activity's screen as a bitmap.
Split it into two parts.
Animate the bitmaps outwards.
Related
I've just started an android development course and we had an assignment. I should create a simple birthday card app. That was not a problem until I started looking around and saw this picture.
I know 2 ways to achieve this. First, child TextViews in LinearLayout which might not allow to stack them in that sort of leaning/analog fashion. Second, and possible the simplest way I can think of, is to crop the text part and use it as an ImageView on top of the background.
I'm trying to challenge myself to create those bubbles using the code and I was wondering if somebody could help me do it.
Thanks!
If you want to recreate the stack of words on the right, you cannot use a LinearLayout. The LinearLayout won't allow you to overlap the TextViews. You'll have to use a RelativeLayout or ConstraintLayout. Each TextView should have a background image for the color and speckle design, you'll control how big the background is with TextView's padding and margin attributes. Finally you can tilt / rotate each TextView with the rotate attribute.
Don't get too ambitious with your early homework assignments, you wouldn't want to get frustrated and lose interest!
I have a custom LinearLayout class that I use to give a framed look to my views. When I want to add something to a frame, I add my views inside that custom LinearLayout.
Now my problem is, in one of my frames, I use MapView. And this MapView causes the frame's background to be erased/removed randomly. The background is usually gone for a second and then it comes back. Sometimes only a part of the background is removed, but usually all of it. In the first screenshot, the frame is as it should be. And in the second screenshot, it is the case that background is disappeared.
Has anyone experienced something like this? Any help is appreciated. Thank you.
You can bring your header to front by adding bringToFront();
More details : http://developer.android.com/reference/android/view/View.html#bringToFront()
I've designed some buttons with photoshop but now it came in my mind the problem on how make them work.
Basically I've this image
I've thought about two solutions: the first one is to place them in a RelativeLayout and place them with "lot" of padding/margin work, the second solution is to cut them vertically and attach them one by one, like this:
In the second solution I cannot probably use selector, not on all the button at least, not a big issue btw. With the first one I'm a bit worried about scaling on different screen sizes.
It will be a problem? Which solution would you suggest?
Thanks in advance.
Its not a must that your clickable area should be the same shape as your image shape..
Change the Image onclick...
If your options are open to use an image view instead of button, Then the whole image will be clickable.
I searched all over to find this question similar to yours.. Hope it helps.
Android provides the SlidingDrawer by default looks like below image -
Image http://www.gru.at/android/wp-content/uploads/2010/09/s_open.png
Can we customize this SlidingDrawer looks like semi-circle type with buttons included. For, example take a look at below image -
Anyone done the SlidingDrawer like above one. I've googled it. Didn't get any nice solution for this. Anyone has idea/example blog for this?
So make sure you have Gimp and 9-Patch at the ready for a lot of trial and error...
Then what you wanna do is...
Add suitable layout to hold buttons where the current ImageView Handle is, like Horizontal LinearLayout or RelativeLayout
Cut the id of the current ImageView Handle and add it to this new Layout you just added
add your buttons to the LinearLayout/RelativeLayout (you can test it now, the buttons and the handle should all slide open at the same time)
Now add Button listeners for each of the buttons
Set the SlidingDrawer to android:allowSingleTap = "false" (tit for tat, you cant have the single tap option anymore, just the slide)
Use a ButtonSelector.xml to have different layouts for buttons be pressed or not pressed.
This is the hard part. Edit the drawables for the buttons, and handle so that they will fit together nicely if the screen is huge, small, landscape, portrait. I recommend using 9-Patch in conjunction with Gimp.
Pat yourself on the back because you now have a totally sweet custom sliding drawer.
Make sure you post pictures and state any problems or issues you ran into as I have never fully implemented this, but I did get to step 6 to make sure it was possible.
Last but not least, Good Luck...
Thanks for RelativeLayout and FrameLayout These layouts makes my requirement comportable with what i need. I've done like below steps -
First, i've splitted the full image into three pieces. And, merge these images with FrameLayout And, gave onclickListner to my center of image(Because, it was contain that arrow marks up/down)
And, i've used the Animation for just to open that View as SlidingDrawer
These steps helps me lot.
First off, I'm a beginner. If this is way beyond the scope of a beginner's first application, just tell me.
The best way to explain what I want is as an example: In Robo Defense, when you kill something, a little $10 pops up, animate translates/fades up about 5% of the screen and disappears. (almost like a toast, appears on top of canvas)
I'm looking for something similar to that same effect. As a like, top-layer drawable that ignores the underlying defined XML layout. I can handle the animation part of the code, but I'm curious as to how to create and inflate that view without wreaking chaos on my current layout. If it would be easier as a drawable instead of text, thats really not a big problem for my project. It is simply imformative, no interactivity at all, it will just be a quick little 500ms artifact to show that an action has occurred.
I could use a pointer in the right direction, or some similar code examples please.
I think you would create the TextView within your Java code, and then use an animation to make it rise and fade, once the animation has finished, destroy the TextView.
I've never done this before, but I think that should work!
To anyone else who is wondering, I ended up accomplishing this via wrapping my entire layout in RelativeLayout, making the appropriate changes necessary, then creating a TextView programmatically with layout_above, and then calling an Animation on it.