Obtain iOS7-like blur effect with Qt - ios

I was asking myself how I could obtain an iOS 7 like blur/transparency effect. Something like this:
(source: ilounge.com)
I'd like to apply this to a whole QDialog. I know how to obtain a nice transparency, but not how to get this blur.
Can someone help?
Thanks a lot!

Basically, you need to first get a screenshot of the desktop. Then you need to blur it. Then probably save the image to the harddrive. Then you need to set it as the background for your dialog.
And then you need to make the background for each button transparent, too.
If you use QGraphicsView or OpenGL, the last three steps may be very different.
http://qt-project.org/doc/qt-5.0/qtgui/qscreen.html#grabWindow
http://qt-project.org/doc/qt-5.0/qtwidgets/desktop-screenshot.html
Lines of code where it actually grabs the screen:
QScreen *screen = QGuiApplication::primaryScreen();
if (screen)
originalPixmap = screen->grabWindow(0);
In Qt 4.8, it used to be done this way:
http://qt-project.org/doc/qt-5.0/qtgui/qpixmap.html#grabWindow
To blur the screenshot, use this:
http://doc-snapshot.qt-project.org/4.8/qgraphicsblureffect.html
You may need to save it to the harddrive for QStylesheets to be able to find it.
To set the background image, try something like this:
http://qt-project.org/doc/qt-5.0/qtwidgets/stylesheet-reference.html#background-image-prop
Example of how to set a stylesheet:
qApp->setStyleSheet("QLineEdit { background-color: yellow }");
http://qt-project.org/doc/qt-4.8/stylesheet-examples.html
http://qt-project.org/forums/viewthread/1397
Hope that helps.

Thanks a lot for your help phyatt, I succeeded. Although my code works, the result is not as pretty as iOS':
iOS7-like blur with Qt
however, I'm going to post the whole code on my website, I'll post the link here in a while.
Stay tuned!
[EDIT] here's the link to the detailed how-to: iOS7 like blur effect with QT

Related

Is it possible to change texture hue programatically in Spritekit project?

I am interested in to how change hue of the texture in efficient way ? I am experimenting to create space dust which will change it's color every few seconds with nice, smooth transition from one color to another.
I find this possible in few ways:
Using core image like in this example. But I don't know how will this work in combination with Spritekit...
Using particle emitters to create space dust and change color of particles over time using particleColorSequnece property.
And easy one that came up on my mind , while playing with Photoshop, which is using two same, but differently colored images, one over another, and changing the opacity of the topmost one.
This gives me the effect I want, and actually looks fabulous, but is there any better way ? Maybe using SKTexture? In this particular case, I just need to change from one color to another , but what would be an efficient way to do this when multiple changes are required one after another ? This way, my third example requires additional images...
Here is the link which most closely describe what I am trying to accomplish. Just look how space dust changes its color overtime(from dark blue to purple and later to green or orange). I suppose this is done programatically... I would like to ask moderators to remove a link if it is not suitable to post it here. Thanks!
It is kind of a hard questions to answer and is rather subjective, however...
I personally would do the Emitter Node approach, because it seems like it is built for the type of use you are looking for and could have some cool effects trailing behind.
With that being said you specifically asked about changing the hue and colorBlendFactor might be what you are really looking for. I don't have a great link for it, but this might get you pointed in the right direction. You can see how they are blending colors to get the desired result.
Your solution with changing the alpha of two separate colors doesn't sound like a bad approach either.
Hopefully that helps and good luck =)

Stretching a UIImage across the length of a UIBezierPath

What I basically need to achieve is a Fruit Ninja - style "slash" effect, where the "slash" trails the user's touch and follows the shape of the user's gesture, and is thinner the longer the distance the user has swiped.
The simplest way to achieve this seemed to be to collect all the points the user passes through in a UIBezierPath, and "stretch" an image through the length of the BezierPath. This would achieve the kind of "trailing" effect I was looking for and also ensure that the line is thinner if the distance travelled is longer.
However I can't seem to find a way to actually implement this. Is this even possible?
Alternatives? Thanks.
P.S: This is for a low-medium priority section of a regular app and not a game, so I would like to avoid having go down to OpenGL and spend a lot of time to achieve this (with completely custom drawing, etc). Something at the SDK level would be preferred, and if that's not possible at all, we'll just figure out a different UI.
Thanks!
For pretty easy-to-use stretching teqhniques of images/views you could look into
https://github.com/hfossli/AGGeometryKit/
I recommend trying to draw using CoreGraphics. See this link
http://www.effectiveui.com/blog/2011/12/02/how-to-build-a-simple-painting-app-for-ios/
Okay. Maybe you can use this.
https://github.com/hfossli/AGDraw
Just something I wrote a while ago. Hit clear and try to draw something (clear will toggle between two types of strokes). You'll see the width of the penstroke will increase with the velocity you use.. I guess that fits your need. If you fix some bugs, please make a pull request. You are free to use the code, but I will add a MIT license later.

Apply GPUImage filter to a UIView

I've a problem. I need to apply a filter like Pixelate or Blur to an entire UIView.
Like the eBay iPad app.
I thought to use GPUImage but I don't know how to do it.
There is a way to apply a filter to a GPUImageView directly without pass a UIImage?
The primary problem is that making a screenshot of a large UIView on an iPad 3rd is to expensive (2 seconds for the UIWindow grab). So the perfect solution is to apply filter directly to the views, just like eBay app, but.. how?
Thanks to all!
To pull a view into GPUImage, you can use a GPUImageUIElement source, which takes a UIView or CALayer as input. There's an example of this in the FilterShowcase sample application.
This does rely on the -renderInContext: method of an underlying CALayer, which can be expensive for redrawing the view. However, if the view is static, you just need to use this update once and the resulting image will be cached on the GPU as a texture. Filter actions applied to it after that point will be very fast.
You might be able to achieve the look you are after by applying CIFilters to your views layer.filters property. Check the docs for more info:
https://developer.apple.com/library/mac/#documentation/graphicsimaging/reference/CALayer_class/Introduction/Introduction.html
Maybe this is something for you? Haven't tried it but read about it in a post once:
StackBlur
Ow sorry, I read your post again and this extension is about blurring an UIImage, and you said that this was something you didn't want...
Well I'll leave it here anyways if people go googling for blurring an image..
Sorry :(

How to change the colour of skin in an image using Xcode?

I am creating a new app in which either taking or selecting an existing photo of a person I want to have a control / action so that the skin colour can be changed. For example to show someone with pale skin what they would look like with a sun tan.
Any help would be great!
I am not sure what the requirement, but this is a link to the Apple docs that will help you get started. Check out the part where you can mask certain colors. So if you allowed the user to tap somewhere where skin is exposed, retain a reference to the color and then mask it is one way you could tackle this problem. Here is the apple doc: http://bit.ly/GzHtyH
Hope this helps
Tams

Image Crop component

I need a simple component to do image crop, to use inside an option where user must select an image, photo, or logo to represent them.
I already done some search with Google but found nothing good.
I would something with source code.
A TRect, DrawFocusRect and some handling of OnMouseDown, OnMouseMove, OnMouseUp for allowing user interaction to draw the cropping frame
and
BitBlt to do the actual cropping after the user is happy with the selection he made.
And look, there is an example which uses those same ideas: http://exampledelphi.com/delphi.php/tips-and-tricks/crop-image-with-drag-the-mouse/.
God bless!
Try ImageEn from http://www.hicomponents.com/main/. It does what you want and a lot more. It is free, but not sure if you can get source with it.

Resources