Rotating a RectangleShape without using Graphics - vb.net

For a program that I'm making in vb.net, I need to have a rectangle, with an image displayed on it, rotate and move around the screen. It needs to move quickly and responsively, so I'm using the standard RectangleShape. The problem here is that vb.net apparently has no in-built function to rotate this rectangle. I'm not really able to use the corresponding Graphics equivalent with the FillRectangle, as it's incredibly laggy on the computer I'm using for this- since it requires constant DrawImage functions for separate bitmaps.
So, is there a way to have a Rectangle that can:
Hold an image
Be rotated
Be moved around the stage in a very cpu-unintensive manner
Thank you

Dim mxRotate As New Matrix()
'75 being the arbitrary number I picked to rotate by
mxRotate.Rotate(75, MatrixOrder.Append)
e.Graphics.Transform = mxRotate
e.Graphics.DrawRectangle(YourPen, YourRect)
This can probably help you rotate the image: How to rotate JPEG using Graphics.RotateTransform without clipping
As for performance. I'd imagine all of this will use a little bit of the CPU. Alternatively, you can use DirectX or OpenGL for rendering if that's an option.

Related

Better way of defining several clickable area in a single large image in Corona SDK

I have a large image background with several areas or objects in the images which can be clicked and an event is triggered. The method I'm currently using to accomplish this is by slicing the images of objects and area and positioning them over the background image and assigning a click handler to them.
This works for the moment but I feel that there should be a better way of doing this. One way I thought and tried is to fill the sliced images with black or white, position them over the background image, make their opacity 0, make them hit testable and assign a click handler.
Does this method have advantage over the previous one? Does making an image object transparent use less texture memory or is it the same?
And are there other better ways to do so? My main objective is about making the game use less texture memory and cutting the overall project file size by using less of those sliced images.
Use display.newRect/newCircle to mark down area, make them transparent and hit testable.
This should be more efficient than using images.

Create an irregular shaped frame

I've created a canvas within which I display an image that is clipped when it goes over the edges. I can do this fine with a square shaped frame, however the frame I want to use is the one below. Is there any way I can clip the image inside the frame without having to add a non transparent square border around the image, i.e. just using the black line that I've already drawn? (on iPad)
You'll need to use Core Graphics and Quartz to handle this sort of clipping/graphics manipulation.
http://developer.apple.com/library/ios/#documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/Introduction/Introduction.html#//apple_ref/doc/uid/TP30001066
If you're using UIBezierPath, you may be able to achieve the clipping you're after using the following process
http://developer.apple.com/library/ios/#documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/dq_paths/dq_paths.html#//apple_ref/doc/uid/TP30001066-CH211-TPXREF101
Convert your UIBezierPath to a CGPath
Get your image into a CGContext
Add your CGPath to the context via CGContextAddPath
Clip your context using CGContextClip
Alternatively, if you don't want to be messing with paths (and depending on whether this technique is suitable for your situation, your description of the issue makes it hard to tell), it might be worth using image masking to achieve the effect you're after. See the first link and look under "Bitmap Images and Image Masks".

How to add a shadow to an UIImageView which fits the shape of the image content but with some rotation and shift effect

I have been looking for the solution on the web for a long time. Most tutorials are fairly simple about adding shadow to a UIView. I also noticed that if we add a shadow to an UIImageView. The shadow shape could perfectly fit the shape of the content image if the image itself has alpha channel in it. Say for example, if the image is an animal with transparent background, the shadow shape is also the same as that animal (not a rectangle shadow as same as UIImageView frame).
But these are not enough. What I need to do is to add some changes to the shadow so it may have some rotation angle and compressed (squeezed or shift) effect so that looks like the sunlight comes from a certain spot.
To demonstrate what I need, I upload 2 images below, which I captured from the Google Map App created by Apple. You can imagine the Annotation Pin is an image which has the Pin shape, so the shadow is also "pin shaped", but it is not simply "offset" with a CGSize, you can see the top of the shadow is shifted right about 35 degrees and slightly squeezed the height.
When we tap and hold and pin, the shadow is also animated away from the pin, so I believe that such shadow can be made programmably.
The best shadow tutorial I can found so far is http://nachbaur.com/blog/fun-shadow-effects-using-custom-calayer-shadowpaths But unfortunately, that cannot make this effect.
If anyone know the answer or know any better words to search for, please let me know. Thank you.
(Please note that the shape of the image is dynamic in the App, so using any tool like Photoshop to pre-render the shadow is not an option.)
In order to create dynamic effects like this, you have to use Core Graphics. It's incredibly powerful once you know how to use it. Basically you need to set a skew transform on the context, set up a shadow and draw the image. You will probably have to use transparency layers as well.
It doesn't sound like you can use CALayer shadows, since that is meant to solve a specific use-case. The approach Apple takes with the pin marks on the map is to have two separate images that are created ahead of time (e.g. in Photoshop) and they position them within the map relative to a reference point.
If you really do need to do this at run-time, it should still be possible by using either Core Graphics or ImageKit. To get a blurred shadow appearance, you can use the kCICategoryBlur CIFilter. You can then convert the image to grayscale. And to get that compressed look you just need to resize and skew the image.
Once you have two separate images, you can either take the CGImageRef for the shadow image and can set that as the content of another sublayer, or you can add it as a separate view.
If you know what all the shapes are, you could just render a shadow image in Photoshop or something.

Translate Colors to Image?

Im not sure how else I should approach it, but if I was to (in my mac application) have a grid of NSViews, which the user can change the colour of each, is it possible to then translate this, so now I have been given a colour for each pixel by the user, make this into an exportable image?
I honestly can't think of how else to do this. I don't want to go ahead an realise I have taken a rather foolish path.
The idea is I will have a grid of squares which the user can paint, a colour in each square, a square representing a pixel in the final image. So they paint with like a paint bucket filling each one, then export it into an actual image file.
Any help much appreciated, thanks.
A grid of NSViews sounds really heavy for what you're doing. Why not write one single custom view that checks the mouse position and modifies the data appropriately? Then you'd write a custom drawing method to fill the custom view, and you could use the same exact draw method to write to an NSImage which you could export.
You'll need to do a bit o' math. For each "pixel", call -set on the appropriate NSColor, then use NSBezierPath's -fillRect method. It may help you to get out a pencil & paper to figure out the math for the rect origins & sizes.
Check http://developer.apple.com/library/mac/#documentation/Cocoa/Conceptual/CocoaDrawingGuide/Introduction/Introduction.html for help if you've never done custom drawing before. It's really not that bad, just takes a little reading. :)

Using System.Drawing to make a selection tool, and cropping an image in vb.net

If i wanted to crop an image in VB.net, how would I go about doing it? I am trying to let the user drag out the box they want (system.drawing.rectangle), and it will automatically remove the edges surrounding the box.
My first problem is primarily the fact that I cannot make the system.drawing.rectangle visible. It is not displaying at all, I am setting its location and height programmatically, but nothing is showing up. I know there is probably something fairly obvious I am missing...but I cannot seem to find it.
My larger issue, however, lies with the cropping itself. I cannot find any crop methods, at all. Is there a hidden one I am missing? Or must I code it myself? How would I go about doing this? It ought to be able to output to a bitmap image object.
Thanks for the help, I am surprised this hasn't been asked on here before....
Regarding your first problem: a Rectangle isn't by itself visible. You have to draw it on your canvas using the Graphics object's DrawRectangle(...) method. For drawing a selection tool, you'll want to set your Pen object's DashCap and DashPattern properties.
To "crop" an image, you basically want to take the portion of a larger image delineated by a smaller Rectangle, and turn it into a new Bitmap. This can be done using one of the 30 overloads of the Graphics object's DrawImage(...) method. You can either keep the cropped portion in its original dimensions (resulting in a smaller Bitmap than your original), or you can "blow it up" to something like the original image's size. If you do the latter approach, it is usually a good idea to set your Graphics object's InterpolationMode property to HighQualityBicubic (I think that's the one, anyway), since the default InterpolationMode is pretty crappy.
There are a number of different ways of rendering images in .Net - it might help if you posted some of your code, along with an explanation of the exact problems you're running into.
Here is another answer with a link to a sample app (and source code in C#, sorry) that may help you get started.
There are a number of articles on these topics on CodeProject:
Pick your favorite flavor (though I encourage you to check out the C# projects - it shouldn't be too hard to convert).
VB
Image Cropping with Image Resizing Using vb.net
C#
Cropping Images
An Easy to Use Image Resizing and Cropping Control
Image Processing using C# (see the Cropping section - I was able to use this code in one of my projects)
WPF/C#
WPF Interactive Image Cropping Control
A Photoshop-like Cropping Adorner for WPF