RETableViewManager icon indicating copy to clipboard operation
RETableViewManager copied to clipboard

Text overlap problem in RETableViewPickerCell if text in valueLabel is too long

Open Daemon-Devarshi opened this issue 10 years ago • 2 comments

In my app I am getting a long string from server which I am assigning to valueLabel, once assigned it is getting overlapped over other labels/ components in the cell, attaching the screen-shot for your reference:

valuelabel value too long overlap problem

This problem can be reproduced in sample app by hardcoding a string in layoutSubviews (RETableViewPickerCell class), as shown below:

- (void)layoutSubviews
{
    [super layoutSubviews];
    self.textField.frame = CGRectNull;
    self.textField.alpha = 0;
// Very long string assigned
    self.valueLabel.text = @"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat";
    [self layoutDetailView:self.valueLabel minimumWidth:[self.valueLabel.text re_sizeWithFont:self.valueLabel.font].width];
    [self layoutDetailView:self.placeholderLabel minimumWidth:[self.placeholderLabel.text re_sizeWithFont:self.placeholderLabel.font].width];

    if ([self.tableViewManager.delegate respondsToSelector:@selector(tableView:willLayoutCellSubviews:forRowAtIndexPath:)])
        [self.tableViewManager.delegate tableView:self.tableViewManager.tableView willLayoutCellSubviews:self forRowAtIndexPath:[self.tableViewManager.tableView indexPathForCell:self]];
} 

On debugging I found that re_sizeWithFont: method in NSString (RETableViewManagerAdditions) category is returning a long width value (~1788), because of which in layoutDetailView:minimumWidth: method in RETableViewCell class, program counter is going inside below if condition:

if (frame.size.width < minimumWidth) {
        CGFloat diff = minimumWidth - frame.size.width;
        frame.origin.x = frame.origin.x - diff;
        frame.size.width = minimumWidth;
    }

Results thus obtained are:

po frame
origin=(x=-1483.62183, y=12) size=(width=1788.62183, height=20.5)
 {
  (x=-1483.62183, y=12)
 {
    -1483.62183

    12

  }
  (width=1788.62183, height=20.5)
 {
    1788.62183

    20.5

  }
}

I think we got some clue over here ;-) (hint: check value of x)

Note: If I comment above 'if' condition then this problem does not occur.

Kindly suggest how can I resolve this issue? I think commenting if condition may break some other functionality.

Daemon-Devarshi avatar Dec 29 '14 11:12 Daemon-Devarshi

I have the same problem. Did you sort this out?

ericertl avatar Apr 06 '15 19:04 ericertl

I have a ugly solution, but worked.

    CGFloat textWith = [self.valueLabel.text re_sizeWithFont:self.valueLabel.font].width;
    const CGFloat maxTextWith = 200.f;
    const CGFloat margin = 16.f;

    [self layoutDetailView:self.valueLabel minimumWidth:textWith];
    [self layoutDetailView:self.placeholderLabel minimumWidth:[self.placeholderLabel.text re_sizeWithFont:self.placeholderLabel.font].width];

    if (textWith > maxTextWith) {
        self.valueLabel.frame = CGRectMake(self.contentView.frame.size.width - maxTextWith - margin, self.valueLabel.frame.origin.y, maxTextWith, self.valueLabel.frame.size.height);
    }

esrever10 avatar Jun 24 '15 09:06 esrever10