iOS development-Imitation VW reviews ipad side navigation bar

Source: Internet
Author: User
Tags uikit

Yesterday has actually written a sidebar article, but the feeling is not very clear, this article is added, the ipad read the public comments on the sidebar, basically 90% similar, specific effects can be consulted:

compared to yesterday mainly made two changes, one is the picture and text display position, and the other is about the bottom of the positioning and setting position in the screen when the problem is displayed, the side bar area is self-control, you need to pay attention to the screen when the setting Autoresizingmask, the bottom icon is also set when positioning.

Each button on the navigation bar extracts a parent class Gpdockitem, the code in the header file:

  gpdockitem.h//  grouponproject//Blog Park flyelephant:http://www.cnblogs.com/xiaofeixiang//  Created by Keso on 15/3/11.//  Copyright (c) 2015 Keso. All rights reserved.//#import <UIKit/UIKit.h> @interface gpdockitem:uibutton-(void) imagesetting: (NSString *) BackgroundImage selectedimage: (NSString *) selectedimage; @property (nonatomic,strong)  nsstring  *title;// Background image @property (nonatomic,strong)  nsstring  *backgroundimage;//Select Picture @property (Nonatomic,strong)  NSString  *selectedimage; @end

Compared to the previous code, the main is to add a set background picture and set the selected picture of a hybrid method, defined a Title property, then you can set the text and picture location, rewrite two methods:

Set Picture area-(CGRect) Imagerectforcontentrect: (cgrect) contentrect{    cgfloat  width=contentrect.size.width;    CGFloat  height= contentRect.size.height * 0.7;    Return CGRectMake (0, ten, width, height);} Set Text area-(CGRect) Titlerectforcontentrect: (cgrect) contentrect{    cgfloat  width=contentrect.size.width;    CGFloat  height= contentRect.size.height * 0.3;    CGFloat  position=contentrect.size.height*0.7;    Return CGRectMake (0, position, width, height);}

Set the background picture and the selected picture:

-(void) imagesetting: (NSString *) backgroundimage selectedimage: (NSString *) selectedimage{    Self.backgroundimage=backgroundimage;    Self.selectedimage=selectedimage;}

Set the position of the display text and the picture within the area:

-(void) Settitle: (NSString *) title{    [self settitle:title forstate:uicontrolstatenormal];    Self.titlelabel.textalignment=nstextalignmentcenter;    Self.titleLabel.font = [Uifont systemfontofsize:15];    Normal state is gray    [self settitlecolor:[uicolor graycolor] forstate:uicontrolstatenormal];    Switch text color when not clickable    [self settitlecolor:[uicolor orangecolor] forstate:uicontrolstatedisabled];    Set picture properties    Self.imageView.contentMode = Uiviewcontentmodecenter;}

Code in GPDOCKITEM.M:

gpdockitem.m//grouponproject//Blog Park flyelephant:http://www.cnblogs.com/xiaofeixiang//Created by Keso on 15/3/11./ /Copyright (c) Keso 2015. All rights reserved.//#import ' GPDockItem.h ' @implementation gpdockitem/*//only override drawrect:if you perform custom D rawing.//an empty implementation adversely affects performance during animation.-(void) DrawRect: (cgrect) Rect {//Dra Wing code}*/-(instancetype) initWithFrame: (cgrect) frame{self=[super initwithframe:frame];//if (self) {////U Iimageview *splitline = [[Uiimageview alloc] init];////splitline.frame = CGRectMake (0, 0, gpdockitemwidth, 2);///    /splitline.image = [UIImage imagenamed:@ "Separator_tabbar_item.png"];////[self addsubview:splitline];//// } return self;}    -(void) Settitle: (NSString *) title{[self settitle:title forstate:uicontrolstatenormal];    Self.titlelabel.textalignment=nstextalignmentcenter;    Self.titleLabel.font = [Uifont systemfontofsize:15];    Gray in the normal state.[Self Settitlecolor:[uicolor graycolor] forstate:uicontrolstatenormal];    Switch text color when not clickable [self settitlecolor:[uicolor orangecolor] forstate:uicontrolstatedisabled]; Set picture Properties Self.imageView.contentMode = Uiviewcontentmodecenter;} -(void) imagesetting: (NSString *) backgroundimage selectedimage: (NSString *) selectedimage{self.backgroundimage=    BackgroundImage; Self.selectedimage=selectedimage;}        Set background picture-(void) SetBackgroundImage: (NSString *) backgroundimage{_backgroundimage=backgroundimage;    [Self setimage:[uiimage imagenamed:backgroundimage] forstate:uicontrolstatenormal];    }//Set the selected picture-(void) Setselectedimage: (NSString *) selectedimage{_selectedimage=selectedimage;    [Self setimage:[uiimage imagenamed:selectedimage] forstate:uicontrolstatedisabled];    }//Setting Picture area-(CGRect) Imagerectforcontentrect: (cgrect) contentrect{cgfloat width=contentrect.size.width;    CGFloat height= contentRect.size.height * 0.7; Return CGRectMake (0, ten, width, height);} Set Text area-(CGRECT) Titlerectforcontentrect: (cgrect) contentrect{cgfloat width=contentrect.size.width;    CGFloat height= ContentRect.size.height * 0.3;    CGFloat position=contentrect.size.height*0.7; Return CGRectMake (0, position, width, height);}    -(void) Setframe: (cgrect) frame{//fixed item width high frame.size=cgsizemake (gpdockitemwidth, gpdockitemheight); [Super Setframe:frame];} @end

Inherit from the Gpbottomitem of Gpdockitem, only need to set the auto-scaling property of the portrait and landscape:

  gpbottomitem.m//  grouponproject//flyelephant--http://www.cnblogs.com/xiaofeixiang//  Created by Keso on 15/3/13.//  Copyright (c) 2015 Keso. All rights reserved.//#import ' GPBottomItem.h ' @implementation gpbottomitem/*//only override drawrect:if you perform Cus Tom drawing.//An empty implementation adversely affects performance during animation.-(void) DrawRect: (cgrect) rect {
   
    //Drawing code}*/-(instancetype) initWithFrame: (cgrect) frame{self=[super initwithframe:frame    ];    if (self) {        //auto-scaling        self.autoresizingmask=uiviewautoresizingflexibletopmargin;    }    return self;} @end
   

Positioning in the GPDock.h:

-(void) addlocation{    gpbottomitem *tabitem=[[gpbottomitem alloc]init];        [TabItem imagesetting:@ "Toolbar_switchcity.png" selectedimage:@ "Toolbar_switchcity_selected.png"];        CGFloat y = self.frame.size.height-gpdockitemheight*2-20;    Set position    tabitem.frame = CGRectMake (0, y, 0, 0);        [TabItem settitle:@ "Beijing"];        Set the selected touch Check event    [TabItem addtarget:self Action: @selector (tabitemtouchevent:) forControlEvents: Uicontroleventtouchdown];    Tabitem.tag =4;    [Self addsubview:tabitem];}

Settings in the GPDock.h:

-(void) addsetting{    gpbottomitem *tabitem=[[gpbottomitem alloc]init];        [TabItem imagesetting:@ "Toolbar_setting.png" selectedimage:@ "Toolbar_setting_selected.png"];          CGFloat y = self.frame.size.height-gpdockitemheight-10;    Set position    tabitem.frame = CGRectMake (0, y, 0, 0);        [TabItem settitle:@ "Settings"];    Set the selected touch Check event    [TabItem addtarget:self Action: @selector (tabitemtouchevent:) forControlEvents: Uicontroleventtouchdown];    Tabitem.tag =5;    [Self addsubview:tabitem];}

The two have the same, separate merge is the line, specific to the future to implement the business logic, add it to the Gpdock:

-(Instancetype) initWithFrame: (cgrect) frame{    self=[super initwithframe:frame];    if (self) {        //Auto Scaling height scalable, right margin can be scaled        self.autoresizingmask=uiviewautoresizingflexibleheight| Uiviewautoresizingflexiblerightmargin;       Set background picture        Self.backgroundcolor=[uicolor colorwithpatternimage:[uiimage imagenamed:@ "Toolbar_bg_tabbar.png"];                Add tab        [Self addtabitems];                Add Settings        [self addlocation];                Add Settings        [self addsetting];    }    return self;}

The final results are as follows:

Time hurriedly, line pen hasty, unavoidably omission, welcome correct, write Bo not easy, if have favor, please heartily recommend, recently need to change work, have relevant iOS post can provide under, first thanked ~

iOS development-Imitation VW reviews ipad side navigation bar

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.