Метка в кружке Xamarin Forms

Чего я хочу достичь:

На приведенном ниже снимке экрана есть метка с номером отверстия, я хочу создать круг вокруг этой метки, как мне это сделать?

Ярлык, для которого требуется круг

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

Любое руководство и помощь будут с благодарностью.


person Chad Bonthuys    schedule 18.08.2014    source источник
comment
Добавьте изображение под номером, для лучшего выравнивания вам может потребоваться разбить метку на две метки и поместить их обе в сетку, каждую в свою ячейку - хакерская, но выполняет работу кросс-платформенным образом.   -  person Sten Petrov    schedule 18.08.2014
comment
Привет, Стен. Спасибо за ваш вклад. Я собираюсь попробовать реализовать решение, предложенное Питом, и если ничего не помогает, я использую обходной путь, указанный выше :)   -  person Chad Bonthuys    schedule 19.08.2014
comment
Во что бы то ни стало - пользовательский рендерер - более цивилизованный путь, поэтому я просто высказал свое предложение в качестве комментария.   -  person Sten Petrov    schedule 19.08.2014


Ответы (1)


По следующей ссылке вы найдете код и видео для RoundedBoxView (в середине страницы).

http://forums.xamarin.com/discussion/17792/video-on-making-custom-renderers

Если вы создадите это в своем проекте, вы можете сделать следующее, чтобы создать свою метку с закругленными углами:

*) Сетка в качестве внешнего элемента управления.

*) Создайте RoundedBoxView в качестве дочернего элемента Grid для создания своего круга. Вы можете указать фиксированную ширину/высоту во внешнем элементе управления сетки. чтобы узнать, какое значение указать для свойства CornerRadius объекта RoundedBoxView, или, в качестве альтернативы, подключиться к обработчику событий SizeChanged для установки значений.

*) Создайте элемент управления Label также как дочерний элемент элемента управления Grid и расположите его по центру.

Затем вы можете создать свой текст Hole в Label внутри горизонтального StackLayout, а затем добавить вышеуказанное, чтобы создать желаемый эффект.

person Pete    schedule 18.08.2014
comment
Рад, что смог помочь. Если вам нужны какие-либо дополнительные советы или помощь, всегда помните, что со мной можно связаться и за пределами этого веб-сайта, см. мой профиль для контактной информации. - person Pete; 09.10.2014