IOS, как сделать динамическую ширину/автозапуск UIView в соответствии с UILabel внутри него

Я борюсь с чем-то вроде новичков. У меня есть UIView, в котором я показываю некоторую цену. Я хочу, чтобы UIView имел динамическую ширину в зависимости от цены, если ее 1 евро, то это будет, например, 20pt, если его 2300 евро, тогда он будет как 50pt по ширине.

Я пытался использовать ограничения раскадровки, но без везения. Можно ли сделать это в раскадровке или мне нужно рассчитать ширину UILabel, а затем программно настроить ширину UIView?

Спасибо заранее.

Ответы

Ответ 1

Да, вы можете сделать это в раскадровке. Добавьте метку к вашему виду и прикрепите ее к левому и правому краю (сверху и снизу, если хотите). Дайте ограничениям просмотра его супервизору в направлениях x и y, но не давайте ему ограничение ширины (для этого вам потребуется ограничение по высоте, если вы не привязывали к нему верх и низ метки). Затем представление должно расширяться с помощью метки в зависимости от ее содержимого.

Ответ 2

В общем, автоматическая компоновка выполняется сверху вниз. Другими словами, сначала выполняется макет представления родителя, а затем выполняются все макеты детского представления. Поэтому запрос системы на размер родителя на основе ребенка немного похож на плавание вверх по течению, сложнее сделать, но все же возможно с некоторой работой.

Одним из решений является использование внутреннего размера представления.

Например, UILabel имеет внутренний размер, основанный на тексте в метке. Если a UILabel имеет ведущее ограничение и верхнее ограничение, но никаких других ограничений, то его ширина и высота определяются его внутренним размером.

Вы можете сделать то же самое с пользовательским классом вида, который включает UILabel. Установив внутренний размер настраиваемого класса просмотра на основе собственного значения UILabel, вы получите представление, которое автоматически изменяет размер на основе текста в метке.

Вот как выглядит код для пользовательского класса. Файл .h определяет одно свойство text. Файл .m имеет IBOutlet для дочерней метки. Настройка и получение свойства text просто устанавливает или получает текст с метки. Но есть один очень важный твист, устанавливающий текст, который делает недействительным внутренний размер родителя. Это то, что заставляет систему корректировать размер родительского представления. В приведенном ниже примере родительский размер имеет размер 8 пикселей по всему UILabel.

SurroundView.h

@interface SurroundView : UIView
@property (strong, nonatomic) NSString *text;
@end

SurroundView.m

@interface SurroundView()
@property (weak, nonatomic) IBOutlet UILabel *childLabel;
@end

@implementation SurroundView

- (void)setText:(NSString *)text
{
    self.childLabel.text = text;
    [self invalidateIntrinsicContentSize];
}

- (NSString *)text
{
    return( self.childLabel.text );
}

- (CGSize)intrinsicContentSize
{
    CGSize size = self.childLabel.intrinsicContentSize;

    size.height += 16;
    size.width  += 16;

    return( size );
}

@end

Создание IBOutlet для childLabel может быть немного сложным, поэтому здесь процедура

  • вытащите UIView в раскадровку
  • используйте Инспектор Identity, чтобы изменить класс на SurroundView
  • вытащите UILabel и добавьте его как подзаголовок SurroundView
  • выберите ярлык и откройте редактор помощников
  • показать SurroundView.m в помощнике
  • перетащите из открытого круга в метку, как показано ниже.

enter image description here

Все, что осталось, - это получить ограничения. Ограничения для метки должны выглядеть так:

enter image description here

Ограничения для SurroundView должны быть такими, как показано ниже. Ключевым моментом является то, что Intrinsic Size должен быть установлен на Placeholder, чтобы избежать предупреждений о недостающих ограничениях.

enter image description here

Ответ 3

Поместите ярлык внутри представления и прикрепите края TOP, BOTTOM, TRAILING и LEADING к надписи надписи. Обратите внимание, что вы не указываете ограничение ширины. Теперь добавьте ограничение высоты и ширины в представление. Сделайте выход на ограничение ширины, и когда изменение цены установит константу ограничения ширины вида на нужное значение. Поскольку ярлык прикреплен к представлению, он также будет расширяться.