Home>

In development,There may be a need to like a lot of times,If implemented with a button,Button as a system composite control,The outside is a view->uicontrol container, this article shares with you a uicontrol control based ios like function,

In development,There may be a need to like a lot of times,If implemented with a button,Button as a system composite control,The outside is a view->uicontrol container. The inside contains uilabel and uiimage, as well as some typography rules.It is difficult to use uibutton to do some effects when switching between "Like" and "Unlike".

But we need a uibutton-like event response mechanism.

How to do?

Correct! Just use uicontrol.

uicontrol has two outstanding advantages here:

1. As the parent control of uibutton,With uibutton-like event response mechanism

2. As a simple child control of uiview,Potential as a container view

Design Idea:Implement a custom control,Inherited from uicontrol, which contains some views,What views are included depends on your needs,Mine are two pictures. Then when the event responds,Switch between two pictures.Switch animation can be customized.In this way, a like button with a great degree of freedom in switching effects is realized!

The reference code is as follows:

#import<uikit/uikit.h>
typedef ns_enum (nsinteger, uicontrolflagmode) {
  flagmodelno,  flagmodelyes,  flagmodeldefalt
};
@interface uicontrolflagview:uicontrol
@property (nonatomic, strong) uiimage * nostateimg;
@property (nonatomic, strong) uiimage * yesstateimg;
@property (nonatomic, strong) uiimage * defaultstateimg;
@property (nonatomic, assign) uicontrolflagmode flag;
-(void) setflag:(uicontrolflagmode) flag withanimation:(bool) animation;
@end

m file:

#import "uicontrolflagview.h"
@interface uicontrolflagview ()
@property (nonatomic, strong) uiimageview * nostateimgv;
@property (nonatomic, strong) uiimageview * yesstateimgv;
@property (nonatomic, strong) uiimageview * defaultstateimgv;
@end
@implementation uicontrolflagview
-(id) initwithframe:(cgrect) frame
{
  self=[super initwithframe:frame];
  if (self) {
    //initialization code
  }
  return self;
}
-(void) setnostateimg:(uiimage *) nostateimg
{
  if (! self.nostateimgv)
  {
    self.nostateimgv=[[uiimageview alloc] initwithframe:self.bounds];
    self.nostateimgv.contentmode=uiviewcontentmodecenter;
    [self addsubview:self.nostateimgv];
    self.flag=flagmodelno;//default style
  }
  self.nostateimgv.image=nostateimg;
  _nostateimg=nostateimg;
}
-(void) setyesstateimg:(uiimage *) yesstateimg
{
  if (! self.yesstateimgv)
  {
    self.yesstateimgv=[[uiimageview alloc] initwithframe:self.bounds];
    self.yesstateimgv.contentmode=uiviewcontentmodecenter;
    [self addsubview:self.yesstateimgv];
    self.yesstateimgv.alpha=0.0;
  }
   self.yesstateimgv.image=yesstateimg;
  _yesstateimg=yesstateimg;
}
-(void) setdefaultstateimg:(uiimage *) defaultstateimg
{
  if (! self.defaultstateimgv)
  {
    self.defaultstateimgv=[[uiimageview alloc] initwithframe:self.bounds];
    self.defaultstateimgv.contentmode=uiviewcontentmodecenter;
    [self addsubview:self.defaultstateimgv];
  }
  self.defaultstateimgv.image=defaultstateimg;
  _defaultstateimg=defaultstateimg;
}
-(void) setflag:(uicontrolflagmode) flag withanimation:(bool) animation
{
  if (animation)
  {
    //no->yes
    if (_flag == flagmodelno && flag == flagmodelyes)
    {
     self.yesstateimgv.transform=cgaffinetransformmakescale (0.1f, 0.1f);
     [uiview animatewithduration:0.3 animations:^ {
       self.nostateimgv.alpha=0.0;
       self.yesstateimgv.alpha=1.0;
       self.yesstateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
       self.nostateimgv.transform=cgaffinetransformmakescale (2.0f, 2.0f);
     }
    completion:^ (bool finished)
    {
       self.yesstateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
       self.nostateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
     }];
    }
    //yes->no
    else if (_flag == flagmodelyes && flag == flagmodelno)
    {
      self.nostateimgv.transform=cgaffinetransformmakescale (0.1f, 0.1f);
      [uiview animatewithduration:0.3 animations:^ {
        self.nostateimgv.alpha=1.0;
        self.yesstateimgv.alpha=0.0;
        self.yesstateimgv.transform=cgaffinetransformmakescale (2.0f, 2.0f);
        self.nostateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
      }
       completion:^ (bool finished)
       {
         self.yesstateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
         self.nostateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
       }];
    }
  }
  else
  {
    //no->yes
    if (_flag == flagmodelno && flag == flagmodelyes)
    {
        self.nostateimgv.alpha=0.0;
        self.yesstateimgv.alpha=1.0;
        self.yesstateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
        self.nostateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
    }
    //yes->no
    else if (_flag == flagmodelyes && flag == flagmodelno)
    {
      self.nostateimgv.alpha=1.0;
      self.yesstateimgv.alpha=0.0;
      self.yesstateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
      self.nostateimgv.transform=cgaffinetransformmakescale (1.0f, 1.0f);
    }
  }
   _flag=flag;
}
@end

This is a simple implementation,biggest advantage,Is also the purpose of this article,It's customization and freedom in switching effects!

Throw a brick to attract jade,I hope everyone can make a like button that combines what they think!

Hope you are interested in what is described in this article.

ios
  • Previous Batch processing to filter duplicate rows
  • Next C # method to calculate program execution time