I am trying to add an overlay image to a photo that is taken. Has anyone seen any examples on how I can do this? I want to have a picture which is a transparent PNG file, and then allow the user to take a picture with the image in it.
Iulius is correct that this is essentially a duplicate question. However, just to rule out one issue-- would you like the user to be able to see the overlay while composing the shot? (i.e. if your app makes different hats appear on people's heads, do you want to show the hat floating in space while they take the photo?). If you want to learn more about that, you'll need to use the cameraOverlayView property of the imagePickerController, which lets you superimpose your own view(s) on the camera. There are questions on this topic already on SO, like this one: How to add a overlay view to the cameraview and save it
Update re: scaling-- LilMoke, I assume when you say that the image is offset you're getting into trouble with the difference with the camera's aspect ratio (4:3) and the screen of the iPhone (3:4). You can define a constant and use it to set the cameraViewTransform property of your UIImagePickerController. Here's a code snippet, partially borrowed, and simplified from the excellent augmented reality tutorial at raywenderlich.com:
#define CAMERA_TRANSFORM 1.24299
// First create an overlay view for your superimposed image
overlay = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
overlay.backgroundColor=[UIColor clearColor];
overlay.opaque = NO;
UIImagePickerController *imagePicker;
imagePicker = [[[UIImagePickerController alloc] init] autorelease];
imagePicker.sourceType = UIImagePickerControllerSourceTypeCamera;
imagePicker.showsCameraControls = YES; // assuming you need these?
imagePicker.toolbarHidden = YES;
imagePicker.navigationBarHidden = YES;
imagePicker.wantsFullScreenLayout = YES;
imagePicker.cameraViewTransform = CGAffineTransformScale(imagePicker.cameraViewTransform,
CAMERA_TRANSFORM, CAMERA_TRANSFORM); // If I understood your problem, this should help
imagePicker.cameraOverlayView = overlay;
If code along these lines doesn't get you on track, then maybe you can post all the relevant code from your troubled project here. Hopefully it's just a matter of setting the cameraViewTransform as I said above.
Related
I'm trying to fill a SKShapeNode with an Image/pattern but I'm still unsuccessfull.
Can you help me solving this or giving me an alternative? I want to create a collidable custom shape (from any SpriteKit kind) filled with a pattern image.
I've tried the following:
UIBezierPath *path = [[UIBezierPath alloc] init];
[path addArcWithCenter:CGPointMake(0.0, 0.0) radius:50.0 startAngle:0.0 endAngle:(M_PI*2.0) clockwise:YES];
SKShapeNode *shape = [[SKShapeNode alloc] init];
UIImage *patternImg = [UIImage imageNamed:#"pattern"];
shape.path = path.CGPath;
shape.fillColor = [[SKColor alloc] initWithCGColor:[[UIColor alloc] initWithPatternImage:patternImg].CGColor];
and also:
shape.fillColor = [[SKColor alloc] initWithPatternImage:[[UIImage alloc] initWithCGImage:[UIImage imageNamed:#"Basketball"].CGImage]];
This works (but it isn't what I'm looking for):
shape.fillColor = [SKColor redColor];
Thank you!
Starting from iOS 8.0 there is fillTexture property in the SKShapeNode.
i had the sample problem in my game, finally my solution was to add a SKSpriteNode as a child of the SKShapeNode and it worked fine.
SKSpriteNode* node = [[SKSpriteNode alloc] initWithImageNamed:#"bombIcon.png"];
node.name = #"bomb";
node.size = CGSizeMake(10, 10);
[self.bombNode addChild:node];
Where self.bombNode is a SKShapeNode.
Hope it helps
You could try to achieve that with SKCropNode. However, I've seen several questions here that SKShapeNode cannot act as maskNode for SKCropNode, but I haven't tested it myself. In this case you probably have to use SKSpriteNode instead of SKShapeNode.
Well, using modern Swift (you're using Swift by now, right?), you could try:
var marbleNode: SKSpriteNode!
Then later, in your init method:
marbleNode = SKSpriteNode(imageNamed: "SmallerSwirl");
marbleNode.physicsBody = SKPhysicsBody(circleOfRadius: 35.0)
marbleNode.physicsBody?.dynamic = true
marbleNode.physicsBody?.affectedByGravity = true
print(marbleNode.physicsBody)
marbleNode.position = CGPointMake(centerPoint.position.x + 10.0, centerPoint.position.y + 10.0)
self.addChild(marbleNode)
Okay, so that gives us a round sprite node to work with. The Sprite node is responsive to physics, because you set up its physics body separately. So far, so good. Now we need to address the glossed-over part, namely the introduction of the SmallerSwirl .png image.
When you set up your project, it included an Assets.xcassets (pronounced, "x c assets") entry. Click on it, then click on the "+" sign at the middle/bottom of the first column, by the word filter. From the menu that appears, select "New Image Set". A new entry labeled "Image" appears. Click on the word "Image" to change it to "SmallerSwirl".
Next to the SmallerSwirl entry, you see blanks labeled 1x, 2x, and 3x. They are for different screen resolutions. Start by dragging your preferred .png image into the 1x square. That image can be named whatever you want it to be named. It doesn't have to be named SmallerSwirl, though it can be. Drag other images to the 2x and 3x slots if you like.
Run, and you should see your preferred image embodied as a sprite, dancing around the screen.
This might be a long winded explanation but I'd rather say too much than not enough. In a nutshell I need to embed a series of stacked textViews in a single scrollView programatically and I can't get it working. I'm basing my efforts off the Text Architecture sample code in the docs.
http://developer.apple.com/library/mac/#documentation/TextFonts/Conceptual/CocoaTextArchitecture/TextSystemArchitecture/ArchitectureOverview.html
I can create a textView programatically well enough but I can't make two inside a scroll view and have them move as one and be editable. There's a nice little diagram explaining how it's possible to create pagination using the same basic concepts but there is no accompanying code and I haven't been successful at doing it myself. I've made a sad little collage of overlapping textViews where only one is editable so far.
Also, if there is a standard way of accomplishing this, a nudge in the right direction would be most appreciated.
Here's my code:
float w = self.windowView.frame.size.width;
float h = self.windowView.frame.size.height*.5;
NSSize halfSize = NSMakeSize(w,h);
textStorage = [[NSTextStorage alloc]
initWithString:#"Here's to the ones who see things different."];
NSLayoutManager *layoutManager;
layoutManager = [[NSLayoutManager alloc] init];
[textStorage addLayoutManager:layoutManager];
NSTextContainer *textContainer;
textContainer = [[NSTextContainer alloc]
initWithContainerSize:halfSize];
[layoutManager addTextContainer:textContainer];
NSTextContainer *textContainer2;
textContainer2 = [[NSTextContainer alloc]
initWithContainerSize:halfSize];
[layoutManager addTextContainer:textContainer2];
self.windowView = [[NSTextView alloc]
initWithFrame:_windowView.frame
textContainer:textContainer];
[self.window setContentView:_windowView];
[self.window makeKeyAndOrderFront:nil];
[self.window makeFirstResponder:_windowView];
NSTextView *textView = [[NSTextView alloc]init];
[textView setTextContainer:textContainer2];
[self.windowView addSubview:textView];
[textView setFrameSize:halfSize];
NSPoint thePoint = NSMakePoint(0, self.windowView.frame.size.height);
[textView setFrameOrigin:thePoint];
[textView setEditable:YES];
[textView setNeedsDisplay:YES];
I should mention. I'm an enthusiast, but by no means a particularly competent programmer. Completely self taught. (Well, actually the book I bought did most of the teaching). I just finished Hillegrass's Cocoa Programming for Mac OSX and I'm working on a bit of a personal learning project to get the ball rolling. I want to make a screenwriting app which formats scene headings, descriptions, dialogs, characters, etc in different ways and
attaches a bunch of information to each section so that standing over a block would show information about that particular segment (scene info).
I've been making mini apps to test everything I would need and so far I've gone through the Text Attribute Guide and The Text Layout Guide in the docs and have figured out a lot. I'm using Core data and bindings for most of everything but I'm stuck at what is arguably the most important part of the app. Getting the main scrollView to display stacked blocks of differently styled text that can be accessed individually by other parts of the app. (my thoughts are on creating an array of NSTextViews and using current index to link an array of info items to particular blocks, though I keep thinking this feels like a bindings sort of job.)
Thanks in advance!
Omar
I am developing an app which allows you to select photos and place them into different positions. The workflow is basically:
Tap an area of the screen
UIImagePickerController displays
Select a photo
Photo displays in the tapped area of the screen
I would like it so that if the user goes through this workflow for a second time, the UIImagePickerController when displayed will be showing the same album, and position within that album, that the user was last at.
I've tried saving a reference to the UIImagePickerController, as well as the UIPopoverController, so that they are created only once. However, every time I present the popover containing the UIImagePickerController, it is back at the main photos menu (eg. Camera Roll, Photo Library, My Photo Stream).
Any ideas for how to achieve what I'm after?
You can use ALAssetsLibrary . But this will cost you more effort. First time use – enumerateGroupsWithTypes:usingBlock:failureBlock: to list all album and remember user's choice. And at second time. Just use that album:ALAssetsGroup's – enumerateAssetsUsingBlock: to list all the images and videos. Apple has a few demo you can have a look PhotosByLocation MyImagePicker
keep a UIImagePickerController obj in .h class (for example imagePicker)
alloc the obj once (for example in viewDidLoad)
imagePicker = [[UIImagePickerController alloc] init];
imagePicker.delegate = self;
imagePicker.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
[self.view addSubview:imagePicker.view];
imagePicker.view.hidden = YES;
imagePicker.view.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
imagePicker.view.bounds = CGRectMake(0,20,self.view.frame.size.width, self.view.frame.size.height);
In didFinishPickingMediaWithInfo
if([[info valueForKey:UIImagePickerControllerMediaType] isEqualToString:#"public.image"]){
imagePicker.view.hidden = YES;
}
When you want to show the imagePickerView just do
imagePicker.view.hidden = NO;
Just to point you to right direction. You can use asset library to show the images as a picker. You can use the apple sample code MyImagePicker. The method [[assetsLibrary] enumerateGroupsWithTypes:ALAssetsGroupAlbum usingBlock:^(ALAssetsGroup *group, BOOL *stop) can be used for photo album. Using the asset library you can check which image was selected last and then use the method,
- (void)enumerateAssetsAtIndexes:(NSIndexSet *)indexSet options:(NSEnumerationOptions)options usingBlock:(ALAssetsGroupEnumerationResultsBlock)enumerationBlock;
You can use this method next time to enumerate which image onwards you want to enumerate. This method can accept an indexSet as [NSIndexSet indexSetWithIndexesInRange:NSMakeRange(index, count)] which should help to indicate the last selected image.
To know more about how to use asset library check this.
It should be possible to reach into the resulting UITableView and then find its content offset. You can do this by searching the subviews of the UIImagePickerController's view property for a table view.
for (UIView *view in controller.view) {
if ([view isKindOfClass:[UITableView class]]) {
contentOffset = [(UITableView *)view contentOffset];
}
}
When you represent the view controller, you will want to restore the content offset in a similar fashion.
Note, I haven't actually tested to see the view hierarchy of the UIImagePickerController. Verify its structure by printing its subviews. There is also no guarantee that the structure will stay the same, since you are diving into the private implementation (though it's important to note you are not actually using any private APIs so this is okay).
Use AlAssetsLibrary. It control the image & video capture under the application. there a demo on apple.
https://developer.apple.com/library/ios/#documentation/AssetsLibrary/Reference/ALAssetsLibrary_Class/Reference/Reference.html
look for this or
if you want to make a cutomize album for the image and video here a great example.
https://github.com/Kjuly/ALAssetsLibrary-CustomPhotoAlbum
I'm working on some drawing code. I have that portion working great.
I want to draw over an image, but I want to still be able to see the detail of the image, the black lines, etc.
What I am working on is making a transparent UIImageView that holds the image.
I'm not sure how to get this set up properly though.
Should this be added above the other UIImageView that I color on or below it?
Here's what I have so far:
- (void)viewDidLoad
{
[super viewDidLoad];
topImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 46, 320, 370)];
[topImageView setImage:[UIImage imageNamed:#"imagesmall.png"]];
topImageView.alpha = 1.0;
topImageView.layer.opacity = 1.0;
topImageView.layer.opaque = NO;
[self.view addSubview:topImageView];
[topImageView release];
}
Thoughts anyone?
Yes, you can draw views over other views. They are drawn in the order that they're added as subviews, unless you reorder them after that.
You may need to set the opaque property for some views (this is distinct from and overrides their layer opacity), and set their backgroundColor to nil. UIImageView seems to be transparent by default, as long as its image is; some other UIView subclasses are not.
So, just what is your overlay going to be? If you just need to display one image over another, what you have here seems to work already. If you need to draw some lines programmatically, you'll need to do this:
Create a subclass of UIView.
Implement its drawRect method to display the content you need.
When you add your custom view on top of the background image, make sure it is not opaque and has no backgroundColor.
A common problem here is to find that your foreground is working, but the background isn't being loaded properly. To make sure the background is there, set the alpha of the foreground view to 0.5. You won't want to do that in production, but it will allow you to verify that both views exist.
I am using UIImagePickerController in my application. I am trying to get the camera view's size.
I used:
UIImagePickerController *picker = [[UIImagePickerController alloc] init];
then I tried to get the CGRect from
CGRect rect = picker.view.frame;
but the rect I got included the Controll Bar. I want to get the size of the view without the control bar. Anyone got a clue? I tried to search related topics, but so far didnt get anywhere. Thanks a lot.