iNotes of beginner

Customers love beautiful apps. Their designers make "amazing" mockups. We, developers, make their dreams come true)

I had a task: make custom TabBar in my app. In the first try - I had wrote absolutely custom TabBar with handling all taps, etc. But it was bad idea, as I understood lately.

How I'd do it now.

In iOS 5, we have so simple way to make our custom TabBar.  

First of all, You have to setup the background of TabBar.

[self.tabBarController.tabBar setBackgroundImage:[UIImage imageNamed:@"backgroundImgName"]];

Then, You can setup each your TabBar cell.

for(UITabBarItem *item inself.tabBar.items) {

        [item setFinishedSelectedImage:[UIImage imageNamed:@"selCell"] withFinishedUnselectedImage:[UIImage imageNamed:@"stdCellImg"]];

        [item setTitle: @"someText"];

        [item setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:

                                          [UIColor greenColor], UITextAttributeTextColor,

nil] forState:UIControlStateNormal];

    }    

What does this code do? - It's simple!

1. Setting pics for cells

[item setFinishedSelectedImage:[UIImage imageNamed:@"selCell"] withFinishedUnselectedImage:[UIImage imageNamed:@"stdCellImg"]];

setFinishedSelectedImage: you pass img for displaying selected tab.

withFinishedUnselectedImage: you pass img for normal state of your cell (when cell hasn't chosen).

2. Set text below the image.

 [item setTitle: @"someText"];

3. Set some attributes for this text (f.e. color)

[item setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys: [UIColor greenColor], UITextAttributeTextColor, nil] forState:UIControlStateNormal];

That's all. But, I made one more feature. 

For example, in your tabs, color of text (or maybe text) changes when user select/unselect tab. Let's make it.

You have to implement protocol <UITabBarControllerDelegate>. To do it, don't forget to set self.delegate = self; 

This protocol  has a lot of different methods, but we need 

- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController 

This method calls when user taps on the other tab, and you can configure this transition as you want. You can even forbid transitions to some tabs in this method. Just return NO; from this method. 

But, what we can do to customize out TabBar?  

- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController {

int indexOfView = [tabBarController.viewControllers indexOfObject:viewController];

UITabBarItem *item = [self.tabBar.items objectAtIndex:indexOfView];

[item setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:

[UIColor redColor], UITextAttributeTextColor,

nil] forState:UIControlStateNormal];

    // set prev item gray text

    UITabBarItem *prevItem = [self.tabBar.items objectAtIndex:_prevSelectedTabIndex];

    [prevItem setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:

                                  [UIColor grayColor], UITextAttributeTextColor,

                                  nil] forState:UIControlStateNormal];

         // change prevIndex

    _prevSelectedTabIndex = indexOfView;

return YES;

}

We change color of text below the pic to red on the selected tab. And previous cell set back to gray.

That's all.

Big thanks to this article.

Sort array quickly and convenient.

NSArray *sortedArray = [aRequests sortedArrayUsingComparator: ^(id firstObject, id secondObject) {

NSString *fst = ((ReservationData*) firstObject).reservationID;

NSString *snd = ((ReservationData*) secondObject).reservationID;

return[snd compare:fst options:NSNumericSearch]; //to lower

    //return [fst compare:snd options:NSNumericSearch]; //to higher

}];

After this in sortedArray you will get your array sorted.

return[snd compare:fst options:NSNumericSearch];//to lower

in this case you will have array sorted from MAX -> MIN.

return [fst compare:snd options:NSNumericSearch];//to higher

Sometimes we need to hide keyboard, but we don't know who is responder.

This line of code will help to do it:

 [[UIApplication sharedApplication] sendAction:@selector(resignFirstResponder) to:nil from:nil forEvent:nil];

I had a problem. I had to make first and last cells of tableView with rounded corners. You will say "No problem! Set for view's layer properties: masksToBounds - YES and cornerRadius". BUT! I had to make just 2 corners of cell. 

Ok, let's look at the code.

- (UIImage*)createRoundedMaskForRect:(CGRect)rect topLeft:(CGFloat)radius_tl topRight:(CGFloat)radius_tr bottomLeft:(CGFloat)radius_bl bottomRight:(CGFloat)radius_br

{

CGContextRef context;

CGColorSpaceRef colorSpace;

    colorSpace = CGColorSpaceCreateDeviceRGB();

    // create a bitmap graphics context the size of the image

context = CGBitmapContextCreate( NULL, rect.size.width, rect.size.height, 8, 0, colorSpace, kCGImageAlphaPremultipliedLast );

    // free the rgb colorspace

    CGColorSpaceRelease(colorSpace);

if ( context == NULL ) {

returnNULL;

}

    // cerate mask

CGFloat minx = CGRectGetMinX( rect ), midx = CGRectGetMidX( rect ), maxx = CGRectGetMaxX( rect );

CGFloat miny = CGRectGetMinY( rect ), midy = CGRectGetMidY( rect ), maxy = CGRectGetMaxY( rect );

    CGContextBeginPath( context );

    CGContextSetGrayFillColor( context, 1.0, 0.0 );

CGContextAddRect( context, rect );

    CGContextClosePath( context );

    CGContextDrawPath( context, kCGPathFill );

    CGContextSetGrayFillColor( context, 1.0, 1.0 );

    CGContextBeginPath( context );

CGContextMoveToPoint( context, minx, midy );

CGContextAddArcToPoint( context, minx, miny, midx, miny, radius_bl );

CGContextAddArcToPoint( context, maxx, miny, maxx, midy, radius_br );

CGContextAddArcToPoint( context, maxx, maxy, midx, maxy, radius_tr );

CGContextAddArcToPoint( context, minx, maxy, minx, midy, radius_tl );

    CGContextClosePath( context );

    CGContextDrawPath( context, kCGPathFill );

    // Create CGImageRef of the main view bitmap content, and then

    // release that bitmap context

CGImageRef bitmapContext = CGBitmapContextCreateImage( context );

CGContextRelease( context );

    // convert the finished resized image to a UIImage

UIImage *theImage = [UIImageimageWithCGImage:bitmapContext];

    // image is retained by the property setting above, so we can

    // release the original

CGImageRelease(bitmapContext);

return theImage;  // return the image

}

You pass the rect and radius directly for each corner. And method returns the mask (UIImage). After this, you can use this mask as you want. Simplify our life, I create this:

- (UIView *)putMask:(UIImage *)maskImage onView:(UIView *)aView

{

CALayer *layerMask = [CALayerlayer];

layerMask.frame = aView.bounds;

layerMask.contents = (id)maskImage.CGImage;

aView.layer.mask = layerMask;

return aView;

}

Pass received mask and view that you want to round recting. This method returns your view rounded rected by mask, BUT you don't have to do smth like this:

myView = [self putMask:mask onView:myView]; 

Why? Because you pass myView to the method by pointer. And method change directly this view. Return value left just for convenience.

So, summarize. How to use this all:

UIImageView *yourView;

UIImage *mask = [self createRoundedMaskForRect: yourView.frame topLeft:5 topRight:5 bottomLeft:0 bottomRight:0];

[self putMask:mask onView:yourView];

And don't forget! To use all layers (CALayer) features, include to your project QuartzCore.framework. If you don't know how to include frameworks to project - this for you.

That's all. I hope it will help somebody ;)

Inspired by this post on stackOverflow. 

Once upon time I had to add feature to my app: sending some info about user session in this app to twitter. I thought that it would be pain in the neck: with authentication, different tokens, etc. If you feel the same - don't worry! Tefal Apple thinks of us! 

In iOS 5 they implemented Twitter framework. And now posting tweets is no more complicated than showing your custom view controller.

Ok, let's look a code.

At first don't forget to connect Twitter.framework in your project settings. If you don't know how to do it, Apple documentation will help you Linking to a Library or Framework

And don't forget to #import <Twitter/Twitter.h> in the file where you work.

Code: 

if ([TWTweetComposeViewController canSendTweet]) // to check if twitter is set in device settings

{    

        TWTweetComposeViewController *tweetViewController = [[TWTweetComposeViewController alloc] init];

        [tweetViewController setInitialText:@"Here is text of tweet"];

[tweetViewController addURL:[NSURLURLWithString:@"some.url"]];

[navigationConrtoller presentViewController:tweetViewControlleranimated:YES completion:nil];

        tweetViewController.completionHandler = ^(TWTweetComposeViewControllerResult res) {

            if (res == TWTweetComposeViewControllerResultDone) {

                NSLog(@"twitted successfully");

            } else if (res == TWTweetComposeViewControllerResultCancelled) {

                NSLog(@"user cancelled tweet controller");

}

[navigationConrtollerdismissModalViewControllerAnimated:YES];

};

}else{

        NSLog(@"To use this feature you have to setup twitter on your device");

    }

How does it works? Let's look a little bit closer.

 At first, we have to check is Twitter set on user devise. This is little nuance of this feature. User will be able to use twitter in your app just if he set up it on device (logged in). How to do it.  But I think, that simplicity of implementing outshines all the disadvantages of this way.

Let's back to our ships.

[TWTweetComposeViewController canSendTweet] - checking devise' twitter settings. If user set up all - it returns YES, in opposite you should show the alert with warning.

Next step - creating controller:

TWTweetComposeViewController *tweetViewController = [[TWTweetComposeViewController alloc] init]; 

TWTweetComposeViewController has methods for adding images, setting initial text, adding url.  How you understand, you should set initial text, maybe urls and pics. But you should know, you can't send tweets without user permission. That's why you just can set initial options. 

TWTweetComposeViewController is modal controller, thats why we call – presentModalViewController:animated:

After calling this method, you will see smth like this:

  Now, when blocks are very popular in objective-c, we don't need any delegation, etc. Just completion block.

tweetViewController.completionHandler = ^(TWTweetComposeViewControllerResult res) {

            if (res == TWTweetComposeViewControllerResultDone) {

                NSLog(@"twitted successfully");

            } else if (res == TWTweetComposeViewControllerResultCancelled) {

                NSLog(@"user cancelled tweet controller");

    } 

[navigationConrtoller dismissModalViewControllerAnimated:YES];

};

Objective-C guarantees that completionHandler will be called after closing tweeter controller. Blocks it's a very big theme of another topic. If you want to discover more about blocks - Blocks Programming Topics .

And we hide twitter modal view by sending -dismissModalViewControllerAnimated:

That's all. Now you can implement twitter features in you app so easy ;)

P.S.

Another interesting and useful articles: 

here

and here 

Sometimes we have to forbid something in user interactions or inputting data.

In my case, user is not allowed to input white spaces in email-field.

Let's show how it works.

In our class we have to implement UITextFieldDelegateProtocol

The method what we need is: – textField:shouldChangeCharactersInRange:replacementString:

It called every time when user add or delete characters in textField.

This is implementation of method:

- (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string

{

    if([string rangeOfCharacterFromSet: [NSCharacterSet whitespaceCharacterSet]].location != NSNotFound)  {

        return NO;

    }

    return YES;

}

Ok, looks like true. But how it works?

At first, what is [NSCharacterSet whitespaceCharacterSet]?

An NSCharacterSet object represents a set of Unicode characters. NSString and NSScanner objects use NSCharacterSet objects to group characters together for searching operations, so that they can find any of a particular set of characters during a search. 

More at NSCharacterSet .

As you understand we get standard object that reproduce white spaces (space and tab symbols) and  sending message to your textFiled's string to find this set in it. – rangeOfCharacterFromSet: This methods return NSRange of found elements.

If there is no elements, it returns NSNotFound.

And in our case,  if this elements found in string - our delegate methods returns NO (textField shouldn't change its content), if not found - let it change.

That's it! 

Sometimes we need smart elements of GUI, that can make cool things.

You can create class programmatically, but it’s slow way and you have to make a lot of build-and-runs for checking right placing of elements.

Xib-files make your life easy. Just create your view in xib and connect all IBOutlets/IBActions, etc.

Using IB and creating xibs – it is the theme of another topic. If you don’t know how to use Interface Builder this is for You: Using IB

What about our ships?

After you've finished your view you can use it in another view or view controllers:

NSArray *viewsOfNib = [[[NSBundle mainBundle] loadNibNamed:@"YourXibFileName" owner:self options:nil]; //returns all views of your xib-file

//Now you need to get root view. It's in returned array at index 0

YourView *view = [viewsOfNib: objectAtIndex:0];

//and now you can add your view where you need

[someView addSubview: view];

But we can make our life a little bit simple. Call NSBundle every time it’s not good.

Programmers are lazy! …but tricky :) Let’s show it.

In class that keeps all outlets and actions of your view, rewrite init method like this:

(id)init

{

    return [[[NSBundle mainBundle] loadNibNamed:@"YourXibFileName"

owner:self options:nil] objectAtIndex:0];

}

And now you just need to do this for using your view:

YourView *view = [YourView new];

[someView addSubview: view];

Vuala!