Imitation QQ Chat Interface < a >

First:

You need two models first:
1-> Data Model
2-> Position Model
The data Model code is as follows:

message.h file: #import  < Foundation/foundation.h>typedef enum  {messagestypeme = 0 , //self-made  messagestypeother //others sent }messagestype;  @interface  Messages:nsobject/** * Chat content */  @property  ( nonatomic, copy) NSString *text; /** * Send time */  @property  (nonatomic, copy) NSString *time; /** * Message type */  @property  (Nonatomic, assign) Messagestype *type;+ (Instancetype) messagewithdict: (Nsdictionary *) dict;-(instancetype) initWithDict: (NSDictionary *) Dict;  @end   

Messages.m文件里#import "Messages.h"@implementation Messages+ (instancetype)messageWithDict:(NSDictionary *)dict{    return [[self alloc] initWithDict:dict];}- (instancetype)initWithDict:(NSDictionary *)dict{    if (self = [super init]) {    ／／用KVC字典转模型        [self setValuesForKeysWithDictionary:dict];    }    returnself;}

The location model code is as follows:

MJMessageFrame.h file inside

//font of the body#define Mjtextfont [Uifont systemfontofsize: the]#Import<foundation/foundation.h>#Import<UIKit/UIKit.h>@classMjmessage;@interfaceMjmessageframe:nsobject/** * Avatar's Frame * *@property(Nonatomic, assign, ReadOnly) CGRect iconf;/** * Time frame * *@property(Nonatomic, assign, ReadOnly) CGRect TIMEF;/** * Body Frame * /@property(Nonatomic, assign, ReadOnly) CGRect TEXTF;/** * Cell height * /@property(Nonatomic, assign, ReadOnly) CGFloat cellheight;/** * Data Model * /@property(Nonatomic, Strong) Mjmessage *message;@end

#import "MJMessageFrame.h" #import "MJMessage.h"  @implementation mjmessageframe /** * Calculate Text Size * * @param text need to calculate the size of the word * @param font text fonts * @param the maximum size of maxSize text * *- (cgsize) Sizewithtext: (NSString*) Text font: (Uifont*) Font maxSize: (cgsize) maxsize{nsdictionary*attrs = @{nsfontattributename:font};return[Text boundingrectwithsize:maxsize options:nsstringdrawinguseslinefragmentorigin attributes:attrs context:Nil]. Size;} - (void) Setmessage: (Mjmessage *) message{_message = message;//Spacing    CGFloatpadding =Ten;//width of the screen    CGFloatScreenw = [UIScreen mainscreen]. Bounds. Size. Width;//1. Time    CGFloatTimeX =0;CGFloatTimey =0;CGFloatTimew = Screenw;CGFloatTimeh = +; _TIMEF = CGRectMake (TimeX, Timey, Timew, Timeh);//2. Avatar    CGFloatIcony = Cgrectgetmaxy (_TIMEF);CGFloatICONW = +;CGFloatIconh = +;CGFloatIconX;if(Message. Type= = Mjmessagetypeother) {//Other people's hairIconX = padding; }Else{//The hair of his ownIconX = screenw-padding-iconw; } _iconf = CGRectMake (IconX, Icony, Iconw, Iconh);//3. Text    CGFloatTexty = Icony;//size of text    cgsizeTextmaxsize = Cgsizemake ( Max, maxfloat);cgsizeTextSize = [ SelfSizewithtext:message. TextFont:mjtextfont Maxsize:textmaxsize];CGFloatTEXTX;if(Message. Type= = Mjmessagetypeother) {//Other people's hairTEXTX = Cgrectgetmaxx (_iconf) + padding; }Else{//The hair of his ownTEXTX = Iconx-padding-textsize. Width; }//_TEXTF = CGRectMake (Textx, texty, Textsize.width, textsize.height);_TEXTF = (CGRect{{textx, texty}, textSize};//height of 4.cell    CGFloatTextmaxy = Cgrectgetmaxy (_TEXTF);CGFloatIconmaxy = Cgrectgetmaxy (_iconf); _cellheight = MAX (Textmaxy, iconmaxy) + padding;}@end

Customize a cell that inherits from the UITableViewCell. h file

#import <UIKit/UIKit.h>@class MJMessageFrame;@interface MJMessageCell : UITableViewCell+ (instancetype)cellWithTableView:(UITableView *)tableView;@property (nonatomicstrong) MJMessageFrame *messageFrame;@end

Mjmessagecell. MInside#import "MJMessageCell.h" #import "MJMessageFrame.h" #import "MJMessage.h"  @interface mjmessagecell()/** * Time * *@property(nonatomic,Weak)UILabel*timeview;/** * * Avatar * *@property(nonatomic,Weak)Uiimageview*iconview;/** * * Text * *@property(nonatomic,Weak)UIButton*textview;@end @implementation Mjmessagecell + (Instancetype) Cellwithtableview: (UITableView*) tableview{Static NSString*id = @"Message"; Mjmessagecell *cell = [TableView dequeuereusablecellwithidentifier:id];if(Cell = =Nil{cell = [[Mjmessagecell alloc] Initwithstyle:uitableviewcellstyledefault Reuseidentifier:id]; }returnCell;} - (ID) Initwithstyle: (Uitableviewcellstyle) style Reuseidentifier: (NSString*) reuseidentifier{ Self= [SuperInitwithstyle:style Reuseidentifier:reuseidentifier];if( Self) {//creation and initialization of child controls        //1. Time        UILabel*timeview = [[UILabelALLOC] init];//Timeview.backgroundcolor = [Uicolor redcolor];Timeview. TextAlignment= Nstextalignmentcenter; Timeview. TextColor= [UicolorGraycolor]; Timeview. Font= [UifontSystemfontofsize: -]; [ Self. ContentviewAddsubview:timeview]; Self. Timeview= Timeview;//2. Avatar        Uiimageview*iconview = [[UiimageviewALLOC] init]; [ Self. ContentviewAddsubview:iconview]; Self. IconView= IconView;//3. Text        UIButton*textview = [[UIButtonALLOC] init]; TextView. Titlelabel. NumberOfLines=0;//Automatic line wrappingTextView. BackgroundColor= [UicolorPurplecolor]; TextView. Titlelabel. Font= Mjtextfont; [ Self. ContentviewAddsubview:textview]; Self. TextView= TextView;//4. Set the cell's background color         Self. BackgroundColor= [UicolorClearcolor]; }return  Self;} - (void) Setmessageframe: (Mjmessageframe *) messageframe{_messageframe = Messageframe; Mjmessage *message = Messageframe. Message;//1. Time     Self. Timeview. Text= Message. Time; Self. Timeview. Frame= Messageframe. TIMEF;//2. Avatar    NSString*icon = (Message. Type= = Mjmessagetypeme)? @"Me": @"Other"; Self. IconView. Image= [UIImageImagenamed:icon]; Self. IconView. Frame= Messageframe. iconf;//3. Text[ Self. TextViewSettitle:message. TextForstate:uicontrolstatenormal]; Self. TextView. Frame= Messageframe. TEXTF;}@end

Finally in the controller that needs the chat interface

#import "ViewController.h" #import "MJMessage.h" #import "MJMessageFrame.h" #import "MJMessageCell.h"  @interface viewcontroller () <Uitableviewdatasource, uitableviewdelegate >@property(nonatomic,Strong)Nsmutablearray*messagesframes;@end @implementation viewcontroller - (void) Viewdidload {[SuperViewdidload];} -(Nsmutablearray*) messagesframes{if(_messagesframes = =Nil) {Nsarray*dictarray = [Nsarrayarraywithcontentsoffile:[[NSBundleMainbundle] pathforresource:@"Messages.plist"OfType:Nil]];Nsmutablearray*mfarray = [NsmutablearrayArray]; for(nsdictionary*dict in Dictarray) {//Initialize a message modelMjmessage *msg = [Mjmessage messagewithdict:dict];//frame ModelMjmessageframe *MF = [[Mjmessageframe alloc]init]; Mf. Message= msg;//Add Model[Mfarray ADDOBJECT:MF];    } _messagesframes = Mfarray; }return_messagesframes;} -(Nsinteger) TableView: (UITableView*) TableView numberofrowsinsection: (Nsinteger) section{return    Self. Messagesframes. Count;} -(UITableViewCell*) TableView: (UITableView*) TableView Cellforrowatindexpath: (Nsindexpath*) indexpath{//1. Create a cellMjmessagecell *cell = [Mjmessagecell Cellwithtableview:tableview];//2. Transfer model to cellCell. Messageframe= Self. Messagesframes[Indexpath. Row];//3. Return to cell    returnCell;} -(CGFloat) TableView: (UITableView*) TableView Heightforrowatindexpath: (Nsindexpath*) indexpath{Mjmessageframe *LJFMF = Self. Messagesframes[Indexpath. Row];returnLjfmf. Cellheight;}

.

Imitation QQ Chat Interface < a >