Create your own simple tag cloud in iOS

Create your own simple tag cloud using Label or Button

I was wondering a simple word cloud creation and searched for any instant mix where I can add and get the cloud out.

There are many, but none of them gave me satisfaction. So thought of creating my own.

Here is the logic behind.

1.     Determine the number of tag you want to plant in cloud

2.     Create the same number of labels or button

3.     And now comes the part of placing them on screen.

Here is the how this works.

First, place the first one with x and y as 0. As my status bar is transparent I took the constant as 36.

Then after that compare that with the previous label or button’s frame. If the width of current is greater than screen bounds then push that to next line using Y, otherwise keep the y same and increase X with previous label or button’s X and its width.

Create three array types for colors, tags and  font families.

@property (nonatomic,strong)NSMutableArray *tagsArray;

@property(nonatomic,strong)NSMutableArray *colorArray;

@property(nonatomic,strong)NSMutableArray *fontFamilies;

Here is the code to achieve the same

-(void)showTags {

    int tag = 0;

    for(int i=0;i<80;i++) {

       NSString *theTitle = [NSString stringWithFormat:@"Number %i",i];

        tag=i;

           float fontSize = (arc4random() % 18) + 10;

           [self.view addSubview:[self addLabelWithTitle:theTitle andFontSize:fontSize AndTag:tag]];

            tag++;

        }

    }

-(UIButton *)addLabelWithTitle:(NSString *)theTitle andFontSize:(float)fontSize AndTag:(NSInteger)tag {

    UIButton *theBtn = [UIButton buttonWithType:UIButtonTypeCustom];

      

    [theBtn setTitle:theTitle forState:UIControlStateNormal];

   

   

    UIColor *titleColor = (UIColor *)[self.colorArray objectAtIndex:rand() %10 +1];

   

    [theBtn setTitleColor:titleColor forState:UIControlStateNormal];

    theBtn.titleLabel.font = [UIFont boldSystemFontOfSize:fontSize];

    NSString *fontFamily = [self.fontFamilies objectAtIndex:rand() %[self.fontFamilies count]];

    theBtn.titleLabel.font = [UIFont fontWithName:fontFamily size:fontSize];

    theBtn.tag = tag;

   

   

    [theBtn setContentHorizontalAlignment:UIControlContentHorizontalAlignmentCenter];

    CGRect frame = theBtn.frame;

  

    CGSize stringsize =  [theTitle sizeWithAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:fontSize]}];

    frame.size.width = stringsize.width;

    [theBtn sizeThatFits:stringsize];

   

    theBtn.titleLabel.numberOfLines = 1;

    theBtn.titleLabel.adjustsFontSizeToFitWidth = YES;

    theBtn.titleLabel.lineBreakMode = NSLineBreakByClipping;

    if(tag == 0)

    {

        frame.origin.y = 36;

        frame.origin.x = 0;

       

    }

    else

    {

        UIButton *prevButton = (UIButton *)[self.tagsArray lastObject];

        double sizeAvailable = (self.view.frame.size.width-(prevButton.frame.origin.x+prevButton.frame.size.width));

        if(sizeAvailable >= frame.size.width)

        {       frame.origin.x = prevButton.frame.size.width+prevButton.frame.origin.x;

                frame.origin.y =  prevButton.frame.origin.y;

        }

        else if(sizeAvailable < 30)

        {   frame.origin.x = 0;

            frame.origin.y = prevButton.frame.size.height+prevButton.frame.origin.y+20;

        }

        else

        {

            frame.size.width = sizeAvailable;

            theBtn.frame = frame;

            frame.origin.x = prevButton.frame.size.width+prevButton.frame.origin.x;

            frame.origin.y =  prevButton.frame.origin.y;

           

        }

    }

    theBtn.frame = frame;

    [self.tagsArray addObject:theBtn];

    return theBtn;

}