聊天泡泡(仿微信)By-H罗

在做私信时,聊天泡泡仿着QQ做时,聊天泡泡底图有露出,不怎么好看,微信的就比较好看,当时就因为那2行纠结了好久

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    self.view.backgroundColor=[UIColor grayColor];
    
    /*左边聊天泡泡*/
    UIImage *leftbubbleImage = [UIImage  imageNamed:@"Information-box_secect"];
    leftbubbleImage = [leftbubbleImage stretchableImageWithLeftCapWidth:leftbubbleImage.size.height * 0.3 topCapHeight:leftbubbleImage.size.height * 0.8];
    
    UIImageView  *leftBubbleView=[[UIImageView alloc]init];
    leftBubbleView.image=leftbubbleImage;
    leftBubbleView.frame=CGRectMake(20, 100.0f,leftbubbleImage.size.width*3, leftbubbleImage.size.height*3);
    [self.view  addSubview:leftBubbleView];
    
    //聊天图片
    UIImageView  *ChatPicture0=[[UIImageView alloc]initWithFrame:leftBubbleView.frame];
    ChatPicture0.image=[UIImage imageNamed:@"chat1.jpg"];
    [self.view addSubview:ChatPicture0];
    
    //画图 关键代码
    CALayer *layer0              = leftBubbleView.layer;
    layer0.frame                 = (CGRect){{0,0},leftBubbleView.layer.frame.size};
    ChatPicture0.layer.mask = layer0;
    
    
    /*右边聊天泡泡*/
    UIImage *rightBubbleImage = [UIImage  imageNamed:@"Information-box_blue_nor"];
    rightBubbleImage = [rightBubbleImage stretchableImageWithLeftCapWidth:rightBubbleImage.size.height * 0.3 topCapHeight:rightBubbleImage.size.height * 0.8];
    
    UIImageView  *bubbleView=[[UIImageView alloc]init];
    bubbleView.image=rightBubbleImage;
    bubbleView.frame=CGRectMake(200, 100.0f,rightBubbleImage.size.width*3, rightBubbleImage.size.height*3);
    [self.view  addSubview:bubbleView];
    
    //聊天图片
    UIImageView  *ChatPicture=[[UIImageView alloc]initWithFrame:bubbleView.frame];
    ChatPicture.image=[UIImage imageNamed:@"chat1.jpg"];
    [self.view addSubview:ChatPicture];
    
    //画图 仿weixin
    CALayer *layer              = bubbleView.layer;
    layer.frame                 = (CGRect){{0,0},bubbleView.layer.frame.size};
    ChatPicture.layer.mask = layer;
    
}

 

效果图

聊天泡泡(仿微信)By-H罗
 

 
 

聊天泡泡(仿微信)By-H罗

上一篇:微信支付-JSAPI支付V3-关闭订单


下一篇:微信支付-JSAPI支付V3-发起一次支付请求