How to replicate iOS 7 Blur View in Android - android

I like the style iOS 7 has used for their Notification and Music popover like below.
So, I try to implement this thing in Android. After doing some search, I achieved how to do that. What I have tried is following.
1) First I take a root reference of the View and take a snap of it using getDrawingCache() function of View.
linearLayout.buildDrawingCache();
SoftReference<Bitmap> bitmap = new SoftReference<Bitmap>(
Bitmap.createBitmap(linearLayout.getDrawingCache()));
linearLayout.destroyDrawingCache();
2) I take the position relative to its parent and cut the image as per requirement.
SoftReference<Bitmap> temp = new SoftReference<Bitmap>(
Bitmap.createBitmap(bitmap.get(), 0,
(parentHeight - childHeight), childWidth, childHeight));
3) I make that bitmap image blur with some algorithm. ( I use Fast Bitmap Blur For Android SDK fastBlur effect )
4) set it in the overlay view.
imageView1.setImageBitmap(Utils.fastblur(temp.get(), 8));
But my problem is it takes time to take a snap then giving blur effect and cutting image and then i got final result. While iOS has very fast blurring process like when drawer is coming from bottom, it immediately blur the screen which is behind it.
Is there any other way to achieve that? Because using my scenario, i can't take every second snap of screen and do all process 1 to 4 every second on every move of drawer.

http://nicolaspomepuy.fr/blur-effect-for-android-design/
I don't know if you have seen this link, but check it out. It talks about how blur effects can be achieved in around 200ms.
PS: check out the comments as well !

Ok so if I understand your problem correctly is that is you have a drawer mechanisme that you need to update the blurred image every pixel the drawer has moved?
Then the solution to your problem would be to blur the screen one time and use this image together with some fancy algorithm to show/hide and position that image so that it seems that the drawer will blur instantly but in actually what's happening is that the image was already generated.
You just show more or less of the image to create the effect.
Don't know if I'm making sense or if I even understand your question.

Related

Curved Bottom part of Bitmap image Android

Good day guys.I want to make the bottom part of my own image an curved line.Not to talk back and forth here is an image which i want to get into the application.
Important to notice that i have reached 10th result of the google and everything i came up was only some curved image not in my desired way,the whole image was curved and the lines of 4 parts were connected to single one.
So basically i want the image to be as rectangle as it comes from server and only curve the bottom part of a bitmap.Is that even possible?
Noticae the bottom line is curved,that what i want to achieve,and rest parts are rectangle.Thank you for your time.
If you are trying to change the image itself, photoshop or any editing tool is the right way to do it. besides if you are getting the image from a server somewhere then getting the image adjusted from the server, instead of modifying it on the client side(o your app) has lot of benefits.
But, if want to change the look not the image itself, then that could be achieved by creating a custom image view like answered here.
You can also use a card view hold your image view to achieve some curves, although i don't think that would be efficient or satisfactory for your case.
Sometimes, editing the image in Photoshop is the right way. This can save your android app CPU time.

How to blur the background of new added view on frame layout?Android

I am searching for it from very long time. I want to blur the background of the new added view to the frame layout. The new added view is a linear layout which opens as a pop up. Now how can I blur that frame layout.
I have gone through all the posts regarding blurring the background but i did not find that useful for my problem Because they all suggest to create a bitmap and set it blur on the bitmap. I simply want to blur the complete view behind the pop up
Use this library to blur the background of popup https://github.com/faradaj/BlurBehind
On BlurredActivity show the popup and finish the activity when pop dismiss.
You can use Renderscript Intrinsics, which are a set of built-in functions that require very little code to use, but are optimized for high-performance.
Once you have the blurring, the rest of the process is fairly straight forward. When you plan to leave an activity, create a bitmap of the current view and write it to disk. When you start your new activity (which should have a transparent background), you override the transition (otherwise you’ll get the default zoom), and set the background to the blurred image you saved earlier. Add a fade in for the alpha and you get a nice little effect!
If you’d like to see how this looks in a sample project, you can find it on Github here.

Image auto scrolling in android

I want to create an image auto scrolling for an outer-space type of game. To make it more exact, I want to load 2 background image that uses a single image occupying the whole screen and auto-scroll it alternatively to create an animation that the background image is moving. Don't get confused with auto scrolling and and shifting to another image automatically. I really meant auto scrolling like moving background using 1 image.
I did some research but what I saw are segments of java codes that made me confused. If possible can anyone provide me an example? From loading the image from xml (should I use an imageview with this? or just set the background image of the layout?) and how I should process it in java code to make an image autoscrolling.
Any ideas guys? Thanks! Sorry for asking too much.

How to implement multi-images on screen, each can be selected, moved, rotated, zoomed and bordered?

User can select some images to the screen, and be able to select/drag/move/zoom/rotate each image. When an image is selected, it will have a blue border. And user can also bring an image to the front or background.
Here is sample picture in the following: there are two images(girls) on a star-background. The top one has been selected(it has a blue border).
I don't know have to implement it. For several days of learning, I can now drag/move/zoom/rotate a single image(inside an imageview, and scaled by matrix). But I don't know how to handle multi-images.
I want to know:
Is it still a good idea to use ImageView(for each image), or what classes should I use?
How to implement the orders? (so I can bring them to front or background)
How to determine which image has been selected
How to find and draw the border of selected image?
For now, I just know how to use ImageView, but I'm not sure if I can use it to implement this task. Please give me some advices, thanks !
Drawing everything directly onto a Canvas is one way of doing it. There is an article that covers the basics of using a Canvas. You can read it HERE
There is one major downside in doing this - you have to handle all the input events by yourself. The API won't tell you which image has been clicked, or dragged. You'll have to implement that by yourself.

Creating a 9 Patch with repeatining pattern

iam stuck with the creation of a nine patch for a progressbar background.
It has a repeating pattern like a ruler-scala and that given me headache.
here is a image of what i want(at the bottom) and what i have (top).
can someone give me a hint how to acomplish my goal?
edit: or is it generelly possible to do this with a 9patch?
my other attempt was to make a with android:tileMode="repeat" but there i get problems with the height of my image (repeating in the second line), i need something like repeat-x.
Thanks in advance
edit2: ok i managed to do my repeating 9patch by stretching the whole repeating pattern, but its not ideal :(
You seem to be overestimating the power of 9-patches. The most you could do is have a ruler image with expanding space between the ticks. You can't, however, make a 9-patch that automatically tiles parts of your image.
On the other hand, if you create a BitmapDrawable programatically, you can set the tile mode separately for the X and Y axes.
I used to do this in my webview project using border image which provides both options (repeat, stretch, fill).
As webview has kind of it's own problems in android (mostly fixed element) I decided to be more android for the next project and I found out that it's not possible to have the repeated border using 9Patch. It's so awkward as it's needy but not implemented.
In a word android development area makes me crazy, one option here one option there is a usual thing here.

Categories

Resources