Создание «пузыря чата» на iPhone, как Tweetie - PullRequest
12 голосов
/ 09 декабря 2008

Просто любопытно, пропустил ли я где-нибудь в API, чтобы отобразить изображение чата пузырькового типа, как в приложении SMS для iPhone? Есть несколько приложений, которые используют пузырьки, которые дословно выглядят для iPhone, и мне интересно, используют ли они собственный виджет или свое собственное изображение.

Это также видно в приложении Tweetie, где содержание твитов.

Ответы [ 8 ]

20 голосов
/ 31 марта 2009

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

[UIImage stretchableImageWithLeftCapWidth:15 topCapHeight:13]

Рабочий пример можно увидеть, загрузив источник Twitterfon (он находится на странице часто задаваемых вопросов) Вы можете увидеть, как они кодируют многократно используемый элемент управления, а также примеры изображений для создания собственного пузыря.

Редактировать - источник больше недоступен (возможно, NDA)

Я поднял изображение здесь . Вы должны быть в состоянии выяснить все остальное :)

15 голосов
/ 02 апреля 2010

Здесь есть видеоурок, показывающий метод Jabs http://vimeo.com/8718829, который включает пузырьковую графику во многих цветах. Также здесь есть источник в твиттере https://github.com/jimpick/twitterfon

(это должны быть комментарии к ответу jabs, но у меня недостаточно высокий рейтинг, чтобы комментировать)

6 голосов
/ 09 декабря 2008

Вам нужно использовать свои собственные изображения, и Apple рекомендует использовать 9 UIImageViews (3 строки по 3) (верхний левый угол, верхний средний, верхний правый угол, средний левый бок, середина, средний правый бок, нижний левый угол, нижний Средний, правый нижний угол)

3 голосов
/ 05 апреля 2011

Выезд AcaniChat . Это лучшая версия приложения для сообщений iPhone с открытым исходным кодом. Он использует Core Data и скоро будет использовать WebSockets.

3 голосов
/ 09 декабря 2008

Прочитайте код в ButtonsViewController.m в UICatalog: "+ buttonWithTitle:", который создает растягиваемую кнопку из одного изображения, что аналогично случаю создания пузыря чата.

2 голосов
/ 26 марта 2013

Довольно просто сделать UILabels с растягиваемым фоном изображения. Если вы хотите поместить изображения в пузырь, вам нужно будет сделать некоторые маски, чтобы они выглядели как Apple. Посмотрите пример кода BubbleThingie , например, как сделать маскировку изображения. В нем также есть пример того, как сделать текстовые пузыри, используя UIButton или UILabel.

enter image description here

2 голосов
/ 28 марта 2009

Сегодня я наткнулся на это из одного из своих RSS-каналов.

Это набор элементов пользовательского интерфейса, воссозданных в иллюстраторе

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

http://www.mercuryintermedia.com/blog/index.php/2009/03/iphone-ui-vector-elements

Надеюсь, это поможет.

Крис.

1 голос
/ 04 августа 2012

Многие из наших приложений имеют функцию чата или обмена сообщениями, и многие клиенты просят создать чат "похожий на SMS-чат этого iPhone с пузырьками".

К сожалению, Cocoa SDK не предоставляет удобный и простой способ отображения пузырьков в чате, и многочисленные фрагменты кода, которые мы нашли, тоже не были идеальными - некоторые из них были просто уродливыми, некоторые отображали пузырьки одного размера независимо от текста длина, некоторые не меняли ширину пузырька, некоторые были хорошими, но едва настраиваемыми и т. д.

В конце концов, Алекс - наш ведущий разработчик iOS (который также является техническим директором в Stex) - пошел дальше и написал этот код с нуля. Основные характеристики:

  • легко (действительно легко!) Настраиваемый и встраиваемый. Код основан на подходе подклассов UITableView, поэтому, когда вам нужно добавить средство чата в приложение, рассмотрите это как простое добавление UITableView, где каждая ячейка представляет собой сообщение
  • цвет и стиль легко настраиваемого пузыря - есть 2 изображения, которые можно легко настроить в Photoshop
  • время группировки
  • гибкая высота пузырька и ширина

Код можно скачать с GitHub, https://github.com/AlexBarinov/UIBubbleTableView

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...