How to add UITextView in CCLayer or CCScene in cocos2d-iphone - iphone

I want to add an instruction page where instruction written in UITextView. How to do it in Cocos2d. Because this is a game page and I want to take menu transaction effects of cocos2d like CCTransitionRadialCCW.
I wrote this code
UITextView *textView = [[UITextView alloc] initWithFrame:CGRectMake(10,60, 300,360)];
textView.backgroundColor = [UIColor clearColor];
textView.text = #"I am First enemy";
[textView setEditable:NO];
[[[CCDirector sharedDirector]openGLView]addSubview:textView];
But there is problem that it is added to the main CCDirector page, while I am writing this code
// [[[CCDirector sharedDirector]openGLView]addSubview:textView];
// replaced by :-
[self addChild:textView];
It gives me error. Please tell me how to add UITextView in CCScene or CCLayer.
I know that [self addChild:(CCNode *)node];
addChild: method needs CCNode so please tell me that how can typecast or convert UITextView object to CCNode.
If there is some alternate option for that please tell me .Like CCLabelTTF is alternate for UILabel, is there alternate for UITableView in Cocos2d-iphone.
Thanks in advance

Have a look at CCTableView: http://www.cocos2d-iphone.org/archives/943.
Combining UIKit and Cocos2D in such a way that you have the interleaving you have mentioned is likely to be very difficult, because everything done in Cocos2D is drawn in one OpenGL view. When you add a UIView, you can only add it in front of or behind Cocos2D's view.

No matter which way you're adding the UIView to cocos2d, it will not be animated by the cocos2d transition effects because simply speaking the UIView objects exist outside the OpenGL view that cocos2d uses (and animates in the case of transitions).
Adding UIViews to a cocos2d view as in your first example code is correct. But in order to position the view like a node, you should consider using the CCUIViewWrapper.

Related

Is it good choice to move a Sublayer around a view using UIPanGestureRecognizer?

I have a CALayer and as sublayer to this CALayer i have added an imageLayer which contains an image of resolution 276x183.
I added a UIPanGestureRecognizer to the main view and calculation the coordinates of the CALayer as follows:
- (void)panned:(UIPanGestureRecognizer *)sender{
subLayer.frame=CGRectMake([sender locationInView:self.view].x-138, [sender locationInView:self.view].y-92, 276, 183);
}
in viedDidLoad i have:
subLayer.backgroundColor=[UIColor whiteColor].CGColor;
subLayer.frame=CGRectMake(22, 33, 276, 183);
imageLayer.contents=(id)[UIImage imageNamed:#"A.jpg"].CGImage;
imageLayer.frame=subLayer.bounds;
imageLayer.masksToBounds=YES;
imageLayer.cornerRadius=15.0;
subLayer.shadowColor=[UIColor blackColor].CGColor;
subLayer.cornerRadius=15.0;
subLayer.shadowOpacity=0.8;
subLayer.shadowOffset=CGSizeMake(0, 3);
[subLayer addSublayer:imageLayer];
[self.view.layer addSublayer:subLayer];
It is giving desired output but a bit slow in the simulator. I have not yet tested it in Device. so my question is - Is it OK to move a CALayer containing an image??
Yes, it is OK to move a CALayer containing an image.
If all you want to do with the panning gesture is move the image, then instead of updating the whole frame, you should just update the layer's position property. Like thus:
- (void)panned:(UIPanGestureRecognizer *)sender {
subLayer.position=CGPointMake([sender locationInView:self.view].x, [sender locationInView:self.view].y);
}
Two things:
First, you can't draw ANY conclusions based on the performance of the simulator. Some things on the simulator are an order of magnitude faster than on a device, and other things are significantly slower. Animation is especially a mixed bag.
If you're doing performance-critical work, test it on the device, early and often.
Second, you can certainly animate a layer using a gesture recognizer, but that is an awfully round-about way to do it. Gesture recognizers are designed to work on views, and it's much easier and cleaner to tie the recognizer to a subview rather than a sub layer.
One of the big problems you will have with using a layer is hit-testing. If you let go of your image, then try to drag it some more, you'll have to have the gesture on the containing view, take the gesture coordinates and do hit testing on the layer. Ugh.
Take a look at the gesture based version of the touches sample app from Apple. It shows you how to cleanly move UIView objects around the screen using gestures.
Note that you can create a view that has custom layer content, and drag that around.

How to draw a view over a GLkit view on iOS5/Ipad

I´m creating a GLK view on iOS5.
First, i create the context.
GLKView *view = (GLKView *)self.view;
view.context = self.context;
view.drawableDepthFormat = GLKViewDrawableDepthFormat24;
[self setupGL];
Second, i draw a triangle moving.
This works.
Now, i want to create a view over the GLKview. So, i used the Storyboard, to draw a View (HUDView) with background red, and i put it over the main view. When i run the app, only openGL appear, i assume that red background view is drawing behind GLKView. Why?
I have tried to use on Hudview -> viewDidLoad
[self bringSubviewToFront:self];
But the problem nothing happen.
Any idea how could i solve this problem????
Thanks in advance.
I have found a sample that solve the problem. Glfun is a sample where a openGL layer is drawn, and you can add a hud view over it. Hopes help people :D

How to insert UIImageView in UITextView in the same way that iphone default message (SMS) app uses to insert multimedia content in the UITextView

I want to insert UIImageView in UITextView of Toolbar having send and camera button in the same way as iPhone default SMS app do.
You would be better off using a UIScrollView and managing UITextViews and UIImageViews in it. UITextView doesn't support adding image inline with text. In fact, it doesn't really support anything other than multiline text.
Per your comment below, there are three things I can think of to get the image as part of the text entry box:
They're not using a UITextView, but instead some custom view. That sort of thing is difficult to replicate.
They are overlaying a UIImageView over the UITextView as a subview and setting the contentInset of the UITextView so there is no overlap.
They are using a separate UIView to contain both the UITextView and UIImageView as subviews and simply arrange those subviews as needed.
Both 2 & 3 are very similar (just slightly different approaches) and probably your best approach. Personally, I think 3 is probably the best, since it give you the most control over the position of both views, but 2 should also work fine.
I agree with Aaron. Based on what I have seen, I believe the native SMS app is actually a UITableView with highly modified TableCells. The TableCells are then composite views that contain the UITextView and UIImageView as Aaron suggested.
It might be a little more work up front, but I think you will find the customization of defining your own UITableCell with the above elements will be quite useful and fall in line with the overall iOS paradigm. Things work a lot better when you work with the native paradigms than against / around them.
Cheers
I have one suggetion that try to make html file with image and text as per your requirements and load that html file into webview.
Here you can also back some particular text Bold etc.
I think nice look then textfield.
To make webview just look like simple scroll view just put this method in your code
don't forgot to write this
webView.opaque = NO;,
[self hideGradientBackground:webView]; and
- (void) hideGradientBackground:(UIView*)theView
{
for (UIView * subview in theView.subviews)
{
subview.backgroundColor = [UIColor clearColor];
if ([subview isKindOfClass:[UIImageView class]])
subview.hidden = YES;
[self hideGradientBackground:subview];
}
}
I hope this may help you.
You can implement it using UITextViewDelegate and ContentInset.
- (void)viewDidLoad
{
self.textView.delegate = self;
[self.textView addSubview:self.addedView];
[self.textView setContentInset:UIEdgeInsetsMake(0, 0, CGRectGetHeight(self.addedView.frame), 0)];
}
- (void)textViewDidChange:(UITextView *)textView
{
NSLog(#"%#",NSStringFromCGSize(textView.contentSize));
__weak typeof(self) wself = self;
[UIView animateWithDuration:0.5f animations:^{
[wself.addedView setFrame:CGRectMake(0, textView.contentSize.height + 10, CGRectGetWidth(wself.addedView.frame), CGRectGetHeight(wself.addedView.frame))];
}];
}

CA animation of a UIView inside a UITableView. Like the one on iTunes

I've been checking this site for many of my questions before but this is the first time I actually have to ask someting, so I hope I can make myself clear enough.
I have an App which is nearly finish. The main functionallity is in up and running. I'm only concern in making the whole App visually appealing. The App is maninly a database wich scientifical relevant data. I want the user to be able to store custom data in the DB and to do that I've created a "contact-like" view where the user can save some data. The view contains a table and inside this table, the cell have UITextFields. After entering the data, when the user presses a button, I want to animate the content of the textField to a cabinet-like icon. Very much like when you purchase something in the iTunes on a iOS device.
I've been able to do that animation in a "static" view (not a UITableView), playing around with starting point, end point and so on is a bit of a pain in the neck, but doable after all.
I'm doing the animation in a not really conventional way, I think, but actually very effecive. On the press of the button I create a UILabel, I set the text as the text of the textField and then I use viewAnimationWithDuration block to animate the label. Inside the block I also use Core Animation to animate the layer of the label over a path. Again, not conventional, but straight forward.
The problem I'm having is that I'm not able to create the label over the textField since it is in a UITableView. Mainly the problem is to know the position (or frame, or bounds, or position. I'm really confused already) of the textField and hence, the starting position of the path.
The code I'm using is as follows:
-(IBAction)saveCustom:(id)sender{
UILabel *imageViewForAnimation = [[UILabel alloc] initWithFrame:CGRectMake(l1, l2, l3, l4)];
imageViewForAnimation.text=label.text;
imageViewForAnimation.alpha = 1.0f;
imageViewForAnimation.backgroundColor=[UIColor clearColor];
imageViewForAnimation.textColor=[UIColor blackColor];
imageViewForAnimation.adjustsFontSizeToFitWidth=YES;
[self.view addSubview:imageViewForAnimation];
[UIView animateWithDuration:10.0
delay:0.0
options:UIViewAnimationOptionCurveEaseInOut
animations:^{
// Set up path movement Core Animation begins
CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:#"position"];
CGPoint endPoint = CGPointMake(310, 380); // final point
CGMutablePathRef curvedPath = CGPathCreateMutable();
CGPoint rootViewPoint = [imageViewForAnimation convertPoint:imageViewForAnimation.center toView:taula];
CGPathMoveToPoint(curvedPath, NULL, rootViewPoint.x, rootViewPoint.y); // initial point
CGPathAddCurveToPoint(curvedPath, NULL, 100, 100, 100, 100, endPoint.x, endPoint.y);
pathAnimation.path = curvedPath;
CGPathRelease(curvedPath);
pathAnimation.fillMode=kCAFillModeForwards;
pathAnimation.removedOnCompletion=NO;
pathAnimation.duration=10.0f;
pathAnimation.delegate=self;
[imageViewForAnimation.layer addAnimation:pathAnimation forKey:#"savingAnimation"];
[imageViewForAnimation release];
//Core Animation ends
imageViewForAnimation.transform=CGAffineTransformMakeScale(0.60, 0.60);
// imageViewForAnimation.alpha=0.2;
}
completion:^(BOOL finished){
[imageViewForAnimation removeFromSuperview];
} ];
}
Any help on how to proceed will be much appreciated.
Thanks in advance!
UPDATE:
I went to the Apple Tech Talks in Berlin. In the labs they got, I asked an engineer about that. He wondered that the code I showed him didn't work. I emailed to him and he'll be back to me.
The key thing is to transform the coordinates from the table, to the view.
A UITableView shows a number of UITableViewCells. If you want to customize the controls displayed in a cell, you can add additional controls to the contentView of a UITableViewCell. Depending on how complicated your needs are, you would do this in the UITableViewDelegate or by subclassing UITableViewCell. Just be aware that adding subviews to contentView will likely interfere with the built-on controls (e.g. textLabel or detailTextLabel).
To position your additional controls or animation effects, you can check the bounds of the cell's contentView. Add your controls as subviews of contentView, animate them, and don't forget to remove them when you no longer need them.
Seems pretty conventional animation to me. And yes, effective.
As to a solution, you just need to save some state info when the user requests a save. And draw your animation label on top of the table. Should be no major problems there as long as you have a view available, super view of the table maybe?
Beyond that, how is your UI setup with respect to this table? How is the save custom activated (does the save all data or a specific field, do you have selected cell which you can access to pull the needed origin of your animation data)?
Also, don't forgot to release your UILabel after you add it as a subview, you are leaking it in the code above.

How do I make a side-scrolling iPhone app?

I am working on a side-scrolling iPhone app, and I have every resource, except the actual side scrolling part! How do I make an app so that it side-scrolls? To be more specific, I want the view of the app to scroll when a UIImageview(player) hits the right/left border of the screen.
<:EDIT:>
I am extremely sorry for all of this confusion! All I am making is a SAMPLE iPhone app only to be used in the simulator. In the app, I have a UIImaageview that moves when you touch arrow UIImageviews. PLEASE NOTE THAT ALL INFORMATION SAID BEFORE THIS SENTENCE WORKS PERFECTLY! Now, my problem is that I want the UIView to scroll only ONE picture(this means it doesn't go forever ;)). I have tried using a UIScrollView, but that didn't work. Finally, I am not planning to use Cocos2D or any other game engine besides a basic UIview. This is only a test app, not a coding extravaganza...
If you're writing a game, you may benefit from a lot of the features given to you by engines such as Cocos2D.
Start with a view-based application template so you can get the gist of how this works. Later you can integrate with your existing code.
Create a seamless background image 320 x 960 pixels, named "seamless.png"
Add this ivar to your view controller .h file
UIImageView *bg;
#property (nonatomic, retain) UIImageView *bg;
In your .m file add these #defines before the #implementation line, the #synthesize after.
#define kUpdateRate (1.0 / 60.0)
#define kMoveY (3.0)
#define kTopY (0.0)
#define kBottomY (480.0)
#synthesize bg;
Add this method.
-(void)scrollView; {
float oldY = self.bg.center.y + kMoveY;
float newY = oldY;
if (oldY > kBottomY) {
newY = kTopY;
}
self.bg.center = CGPointMake(self.bg.center.x, newY);
}
Add this to your viewDidLoad method.
self.bg = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"endless.png"]];
[self.view addSubview:self.bg];
self.bg.center = CGPointMake(self.bg.center.x, kTopY);
[NSTimer scheduledTimerWithTimeInterval:kUpdateRate target:self selector:#selector(scrollView) userInfo:nil repeats:YES];
When you run the app, you should have a nice scrolling background.
To sum up what happens: A timer is set up to repeatedly call scrollView:
There, the image is moved downwards until it reaches a predefined point (kBottomY), at which time its position is jumped back up to the top (kTopY) and it starts over again.
You can customize it to only scroll when you want it to or scroll the other way on your own, right?
If the image being side-scrolled is large, I'd suggest scrolled view while taking advantage of CATiledLayer. See the WWDC10 Session 104 video and the "Tiling" sample code.
BTW, there is nothing in the Apple docs that seem to prejudge the use of scroll views for utility or menus.
Are you trying to use a UIScrollView? If so, just set your scrollView's content size to something wider than the screen. For example:
self.scrollView.contentSize = CGSizeMake(640, 480);
You should use a UIScollView (http://www.iphonedevsdk.com/forum/iphone-sdk-tutorials/3393-uiscrollview-tutorial.html). Or am I missing the point?
Just make the main view wider than the screen and change the bounds accordingly to show a different portion of the main view. This assumes your main view does have some kind of a limited width. It's slightly trickier if that view just goes forever. In that case you change the bounds and draw the newly revealed content.
If this doesn't make sense then I think you need to reword your question or do some experimentation to narrow down what you're asking.
Take a look at Cocos2D for the iPhone which also includes a choice of 2 collision engines, chipmunk and box2d
I can also recommend the oreilly book iPhone game development, which if you are new to game development will teach you how to roll a basic game framework