How to draw text on image - iphone

i have a image. in that image i need to draw text.
pls provide any links or sample code to try it out.
Thanks for any help

Just composite an extra view containing the text on top of the image. If you use a UILabel with [UIColor clearColor] for the background color and set opaque to false you will just see the text on top of the image and none of the image will be obscured.
If you want to get an image from the image in a view with the transparent view containing text on top of it, see this answer:
How to obtain a CGImageRef from the content of an UIView?
Something like this:
UIView* baseView = [[UIView alloc] initWithFrame:frameSize];
UIImage* imageToCaption = [UIImage imageNamed:#"myImage.jpg"];
UIImageView* imageToCaptionView = [[UIImageView alloc] initWithImage:imageToCaption];
imageToCaptionView.frame = frameSize;
[baseView addSubview:imageToCaptionView];
[imageToCaptionView release];
// do stuff with fonts to calculate the size of the label, center it in your image etc. etc.
CGRect labelFrame = ...
UILabel* myLabel = [[UILabel alloc] initWithFrame:labelFrame];
myLabel.backgroundColor = [UIColor clearColor];
myLabel.opaque = NO;
// set the color, font, text etc.
[baseView addSubView:myLabel];
[myLabel release];
Not compiled or complete but you get the idea. If you wanted to get the result as an image you would use do [baseView.layer renderInContext:context];

Related

How to repeat image horizantly in dynamic creation in ios

Could any one help me i want to add same image multiple times horizontally with same height and width. Important thing is i am creating image view dynamically i want to use same image view for all images! This is image i want to make horizontally like this but only one row needed like this.
You could achieve this by using stretchableImageWithLeftCapWidth:
UIImage *backgroundImage = [[UIImage imageNamed:#"SheetBackground.png"] stretchableImageWithLeftCapWidth:0.5 topCapHeight:0];
As per your request:
UIImage *backgroundImage = [[UIImage imageNamed:#"q4Ses.png"] stretchableImageWithLeftCapWidth:0.5 topCapHeight:0];
[_scro setBackgroundColor:[UIColor colorWithPatternImage:backgroundImage]];
And using your image:
The output is:
You can set this image on top of either UIScrollview, UIView and buttons. You do not need a for loop for that.
UPDATE:
The above code is for filling the entire background. If you wish to add only for one row then you have to create one UIView and set its colorWithPatternImage like below:
UIImage *backgroundImage = [[UIImage imageNamed:#"q4Ses.png"]
stretchableImageWithLeftCapWidth:1 topCapHeight:0];
UIView *v=[[UIView alloc]
initWithFrame:CGRectMake(0, 0, _scro.frame.size.width, 45)];
[v setBackgroundColor:[UIColor
colorWithPatternImage:backgroundImage]];
[_scro addSubview:v];
And the output:
Make a view of the height of image. But this view can have any width.
Then set your tile image in this view with following code.
UIImage *tiledImage = [UIImage imageNamed:#"myTiledImage.png"];
self.view.backgroundColor = [UIColor colorWithPatternImage:tiledImage];
This will get you the image tiled multiple times horizontally.
If the view spreads the image everywhere on screen then you'll have to add the following code to your view
self.view.clipToBounds = YES;
UIScrollView *myScrollView=[[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, 320, 480)];
CGFloat scrollWidth = 0.f;
for (int i=0;i<10;i++)//i=10,put as many image number u want to display
{
imageView = [[UIImageView alloc] initWithFrame:
CGRectMake(scrollWidth, 0, 80, 60.f)];
imageView.image=[UIImage imageNamed:#"urimagename"];
imageView.tag=i;
[myScrollView addSubview:imageView];
scrollWidth += 100;
}
myScrollView.contentSize = CGSizeMake(scrollWidth, 100);
EDIT:
You can achieve this in one more way.
CodenameLambda1's answer is better than the above one.But still some changes needs to be done in the #CodenameLambda1's answer..as the SOP's requirement is to display it in scrollview.So instead of self.view use scrollview.
UIScrollView *vie=[[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, 320, 60)];
UIImage *tiledImage = [UIImage imageNamed:#"login"];
vie.backgroundColor = [UIColor colorWithPatternImage:tiledImage];
vie.contentSize=CGSizeMake(1400,60);
vie.clipsToBounds = YES;
[self.view addSubview:vie];

UITextView background image does not fit in frame size of UITextView frame

I am developing an app where I need to put a UITextView for the large text. I have a background image of size 180X89(same as UITextView frame size). When put the image behind the UITextView, everything appears good however, when the user hits the text area and keyboard appears, the cursor appears just outside the edge of the image.
I want the cursor to be appeared in textbox.
Code for getting UITextview
CGRect textViewFrame = CGRectMake(125.0f, 155.0f, 180.0f, 90.0f);
UITextView *textView = [[UITextView alloc] initWithFrame:textViewFrame];
textView.returnKeyType = UIReturnKeyDone;
textView.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed: #"textbox.png"]];
textView.delegate = self;
[self.view addSubview:textView];
Try this:
UIImage *bgImage = [UIImage imageNamed:#"textbox.png"];
UIImageView *bgImageView = [[UIImageView alloc] initWithImage:bgImage];
CGRect textViewFrame = CGRectMake(125.0f, 155.0f, 180.0f, 90.0f);
bgImageView.frame = textViewFrame;
UITextView *textView = [[UITextView alloc] initWithFrame:textViewFrame];
textView.returnKeyType = UIReturnKeyDone;
textView.delegate = self;
[self.view addSubview:bgImageView];
[self.view addSubview:textView];
Or something like it.
There is very simple approach. Just use UIImageView behind the TextView and set UITextView Background color as clear color.
What you can do in such situations is to make the size of the UITextView a bit smaller so that it just comes in ur background image and also give the UITextView a corner radius using the framework <QuartzCore> like textview.layer.cornerRadius = 10; (import the header for the framework). This approach would also give the UITextView edges a bit of roundness to make it look like the image u provided above.
So, in short add the UIImageView then add the UITextView above it and make the background of the textview as clearcolor . Hope this helps !!! :)
Add UIImageView on your view, Then add UITextView on UIImageView with inner frame of
CGPointMake(10,10) as Origin
and CGSizeMake(imageView.frame.size.width - 20.0, imageView.frame.size.hieght - 20.0) as Size of textView.

How to set background image for a View?

the default background color is white and I want to change it to an image
I have tried this:
self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"background.png"]];
but the background turn black, the image is not at the background. I don't know why.
by the way if I have more than 1 image in one view, how to set their priority of display?
UIImageView *backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"imageone"]];
backgroundView.frame = self.view.bounds;
[[self view] addSubview:backgroundView];
Try this out, this is calling self.view.bounds for the frame instead of self.view.frame for frame. I just tested it and it works perfectly.
EDIT: If all you're looking for is to send the image to the back of the stack, you can do the following and select send to back.
Code for you :
UIImageView *myImage = [[[UIImageView alloc]initWithImage:[UIImage imageNamed:#"background.png"]]autorelease];
myImage.frame = self.view.frame;
[self.view addSubview:myImage];
You should to use a UIImageView and its frame is uiview's frame.

highlight a part of the cell when selected

I am trying to add a non-standard color to the cell when its highlighted. FOr this i create a view with the background color that i want and set it as the selectedBackgroundView for the cell.
All is fine.
UIView *selectionView = [[UIView alloc] init];
[selectionView setBackgroundColor:[UIColor colorWithRed:(121/255.0) green:(201/255.0) blue:(209/255.0) alpha:1.0]];
[cell setSelectedBackgroundView:selectionView];
My question, can i change the frame of the selectedBackgroundView so that it highlights only a part of the cell (to be precise, i want the selectionBackroundView to have an X-offset of 20 pixels).
is there any easy way of doing this ?
Updated code :
UIView *selectionView = [[UIView alloc] init];
[selectionView setBackgroundColor:[UIColor clearColor]];
UIView *selectionSubView = [[UIView alloc] initWithFrame:(CGRectMake(20.0f, 0.0f, 300.0f, 72.0f))];
[selectionSubView setBackgroundColor:[UIColor colorWithRed:(121/255.0) green:(201/255.0) blue:(209/255.0) alpha:1.0]];
UIView *clearView = [[UIView alloc] initWithFrame:(CGRectMake(0.0f, 0.0f, 20.0f, 72.0f))];
[clearView setBackgroundColor: [UIColor clearColor]];
[selectionView addSubview: selectionSubView];
[selectionView addSubview: clearView];
[cell setSelectedBackgroundView: selectionView];
THis doesn seem to work either. I have added this code in the 'cellForRowAtIndexPath'
Thanks in advance
You could put a smaller UIView as subview of your selectionView and change tha background color of that view.
You can do like this.
You create the separate file for UIView as below.
TestView.m
- (id)initWithFrame:(CGRect)frame {
self = [super initWithFrame:frame];
if (self) {
// Initialization code.
[self setBackgroundColor:[UIColor clearColor]];
}
return self;
}
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
/* Draw a circle */
// Get the contextRef
CGContextRef contextRef = UIGraphicsGetCurrentContext();
// Set the border width
CGContextSetLineWidth(contextRef, 1.0);
// Set the circle fill color to GREEN
CGContextSetRGBFillColor(contextRef, 100.0, 255.0, 0.0, 1.0);
// Set the cicle border color to BLUE
CGContextSetRGBStrokeColor(contextRef, 0.0, 0.0, 255.0, 1.0);
// Fill the circle with the fill color
CGContextFillRect(contextRef, CGRectMake(20, 0, rect.size.width, rect.size.height));
// Draw the circle border
//CGContextStrokeRectWithWidth(contextRef, rect, 10);//(contextRef, rect);
}
And this Custom View you can use as a background View for cell selection like this.
TestView *bgView = [[TestView alloc] initWithFrame:cell.frame]; // Creating a view for the background...this seems to be required.
cell.selectedBackgroundView = bgView;
May be this help you.
Thanks,
Minesh Purohit.
Does the cell have fixed size and highlight area ?
If yes, create an image and use image view as the selectedBackgroundView
Try to set frame size for selectionView where x = 20. I am not sure about this but I guess it should work for your given scenario.

How to tint an image/show a colour?

2 things i want to do, which are related:
Show a block of any colour. So i could change that colour to something else at any time.
Tint a UIImage to be a different colour. An overlay of colour with alpha turned down could work here, but say it was an image which had a transparent background and didn't take up the full square of the image.
Any ideas?
Another option, would be to use category methods on UIImage like this...
// Tint the image, default to half transparency if given an opaque colour.
- (UIImage *)imageWithTint:(UIColor *)tintColor {
CGFloat white, alpha;
[tintColor getWhite:&white alpha:&alpha];
return [self imageWithTint:tintColor alpha:(alpha == 1.0 ? 0.5f : alpha)];
}
// Tint the image
- (UIImage *)imageWithTint:(UIColor *)tintColor alpha:(CGFloat)alpha {
// Begin drawing
CGRect aRect = CGRectMake(0.f, 0.f, self.size.width, self.size.height);
UIGraphicsBeginImageContext(aRect.size);
// Get the graphic context
CGContextRef c = UIGraphicsGetCurrentContext();
// Converting a UIImage to a CGImage flips the image,
// so apply a upside-down translation
CGContextTranslateCTM(c, 0, self.size.height);
CGContextScaleCTM(c, 1.0, -1.0);
// Draw the image
[self drawInRect:aRect];
// Set the fill color space
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextSetFillColorSpace(c, colorSpace);
// Set the mask to only tint non-transparent pixels
CGContextClipToMask(c, aRect, self.CGImage);
// Set the fill color
CGContextSetFillColorWithColor(c, [tintColor colorWithAlphaComponent:alpha].CGColor);
UIRectFillUsingBlendMode(aRect, kCGBlendModeColor);
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
// Release memory
CGColorSpaceRelease(colorSpace);
return img;
}
The first one is easy. Make a new UIView and set its background color to whatever color you’d like.
The second is more difficult. As you mentioned, you can put a new view on top of it with transparency turned down, but to get it to clip in the same places, you’d want to use a mask. Something like this:
UIImage *myImage = [UIImage imageNamed:#"foo.png"];
UIImageView *originalImageView = [[UIImageView alloc] initWithImage:myImage];
[originalImageView setFrame:CGRectMake(0.0f, 0.0f, 100.0f, 100.0f)];
[parentView addSubview:originalImageView];
UIView *overlay = [[UIView alloc] initWithFrame:[originalImageView frame]];
UIImageView *maskImageView = [[UIImageView alloc] initWithImage:myImage];
[maskImageView setFrame:[overlay bounds]];
[[overlay layer] setMask:[maskImageView layer]];
[overlay setBackgroundColor:[UIColor redColor]];
[parentView addSubview:overlay];
Keep in mind you’ll have to #import <QuartzCore/QuartzCore.h> in the implementation file.
Here is another way to implement image tinting, especially if you are already using QuartzCore for something else.
Import QuartzCore:
#import <QuartzCore/QuartzCore.h>
Create transparent CALayer and add it as a sublayer for the image you want to tint:
CALayer *sublayer = [CALayer layer];
[sublayer setBackgroundColor:[UIColor whiteColor].CGColor];
[sublayer setOpacity:0.3];
[sublayer setFrame:toBeTintedImage.frame];
[toBeTintedImage.layer addSublayer:sublayer];
Add QuartzCore to your projects Framework list (if it isn't already there), otherwise you'll get compiler errors like this:
Undefined symbols for architecture i386: "_OBJC_CLASS_$_CALayer"
An easy way to achieve 1 is to create a UILabel or even a UIView and change the backgroundColor as you like.
There is a way to multiply colours instead of just overlaying them, and that should work for 2. See this tutorial.
Try this
- (void)viewDidLoad
{
[super viewDidLoad];
UIView* maskedView = [self filledViewForPNG:[UIImage imageNamed:#"mask_effect.png"]
mask:[UIImage imageNamed:#"mask_image.png"]
maskColor:[UIColor colorWithRed:.6 green:.2 blue:.7 alpha:1]];
[self.view addSubview:maskedView];
}
-(UIView*)filledViewForPNG:(UIImage*)image mask:(UIImage*)maskImage maskColor:(UIColor*)maskColor
{
UIImageView *pngImageView = [[UIImageView alloc] initWithImage:image];
UIImageView *maskImageView = [[UIImageView alloc] initWithImage:maskImage];
CGRect bounds;
if (image) {
bounds = pngImageView.bounds;
}
else
{
bounds = maskImageView.bounds;
}
UIView* parentView = [[UIView alloc]initWithFrame:bounds];
[parentView setAutoresizesSubviews:YES];
[parentView setClipsToBounds:YES];
UIView *overlay = [[UIView alloc] initWithFrame:bounds];
[[overlay layer] setMask:[maskImageView layer]];
[overlay setBackgroundColor:maskColor];
[parentView addSubview:overlay];
[parentView addSubview:pngImageView];
return parentView;
}