Show More Button Next to End of Text Swift

Show more button next to end of text Swift

Here's a great CocoaPod for the functionality you're looking for.

https://github.com/ilyapuchka/ReadMoreTextView

This will allow you to set a maximum number of lines and customise the text append to the end of the trimmed text. You can change the font and color since it is an NSAttributedString.

Add ...Read More to the end of UILabel

So this is what I did to add the Read More... button to the UITextView, UITextField or UILabel:

- (void)addReadMoreStringToUILabel:(UILabel*)label
{
NSString *readMoreText = @" ...Read More";
NSInteger lengthForString = label.text.length;
if (lengthForString >= 30)
{
NSInteger lengthForVisibleString = [self fitString:label.text intoLabel:label];
NSMutableString *mutableString = [[NSMutableString alloc] initWithString:label.text];
NSString *trimmedString = [mutableString stringByReplacingCharactersInRange:NSMakeRange(lengthForVisibleString, (label.text.length - lengthForVisibleString)) withString:@""];
NSInteger readMoreLength = readMoreText.length;
NSString *trimmedForReadMore = [trimmedString stringByReplacingCharactersInRange:NSMakeRange((trimmedString.length - readMoreLength), readMoreLength) withString:@""];
NSMutableAttributedString *answerAttributed = [[NSMutableAttributedString alloc] initWithString:trimmedForReadMore attributes:@{
NSFontAttributeName : label.font
}];

NSMutableAttributedString *readMoreAttributed = [[NSMutableAttributedString alloc] initWithString:readMoreText attributes:@{
NSFontAttributeName : Font(TWRegular, 12.),
NSForegroundColorAttributeName : White
}];

[answerAttributed appendAttributedString:readMoreAttributed];
label.attributedText = answerAttributed;

UITagTapGestureRecognizer *readMoreGesture = [[UITagTapGestureRecognizer alloc] initWithTarget:self action:@selector(readMoreDidClickedGesture:)];
readMoreGesture.tag = 1;
readMoreGesture.numberOfTapsRequired = 1;
[label addGestureRecognizer:readMoreGesture];

label.userInteractionEnabled = YES;
}
else {

NSLog(@"No need for 'Read More'...");

}
}

There is a use of fitString:intoLabel method which can be found here.

As for the UITagTapGestureRecognizer is just a normal UITapGestureRecognizer subclass with a NSInteger property called tag. I did that because I want to identify which Read More... were clicked in I case I have more than one in the same UIViewController. You can use a normal UITapGestureRecognizer.

Enjoy!

Add Read More/Read Less to the end of UILabel SWIFT

Please try this:-

class FirstViewController: UIViewController, UIGestureRecognizerDelegate {

@IBOutlet weak var myLabel: UILabel!

override func viewDidLoad() {
super.viewDidLoad()
myLabel.text = "bla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla blabla bla bla"
myLabel.numberOfLines = 2
let tap:UITapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(self.labelAction(gesture:)))
myLabel.addGestureRecognizer(tap)
myLabel.isUserInteractionEnabled = true
tap.delegate = self
}

@objc func labelAction(gesture: UITapGestureRecognizer)
{
if myLabel.numberOfLines == 0 {
myLabel.numberOfLines = 2
} else {
myLabel.numberOfLines = 0
}
}
}

If you want to handle using button then :

@IBAction func action(_ sender: Any) {
if myLabel.numberOfLines == 0 {
myLabel.numberOfLines = 2
} else {
myLabel.numberOfLines = 0
}
}

Also, you need to set constraints for the label height like below screenshot:
Sample Image

If you want to show more and less text at the end of label text then add more text and less text in the label accordingly.



Related Topics



Leave a reply



Submit