Перейти к содержанию
Fire Monkey от А до Я
  • 0

Частичная прозрачность


Thorn_

Вопрос

Здравствуйте.

Подскажите, пожалуйста, есть ли способ сделать прозрачной часть контрола. Например, на форме размещен прямоугольник (TRectangle), на прямоугольнике размещен круг (TCircle), как сделать так, чтобы область прямоугольника, ограниченная кругом была прозрачной (проще говоря, прямоугольник с окошком)?

Ссылка на комментарий

Рекомендуемые сообщения

  • 0

Самый простой вариант - нарисовать в обычном графическом редакторе нужный прямоугольник с дыркой и сохранить его в png.

Сложный вариант копать сторону TPath - - по факту это SVG формат, векторная графика. Можно сделать вот как на видео (обвести иконки, создать path и закинуть SVG данные вTPath). 

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

 

 

 http://www.webdelphi.ru/2012/04/firemonkey-2/

 

 

 

Изменено пользователем ENRGY
Ссылка на комментарий
  • 0
8 часов назад, ENRGY сказал:

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

 

А чем не устраивает программа из видео?

Ссылка на комментарий
  • 0
5 часов назад, Rusland сказал:

А чем не устраивает программа из видео?

Во первых PixPower на немецком,  а версии на английском нету. Я не с первой попытки открыл иконку, а уж что-то другое сделать и подавно не смогу - к примеру как показать эту панельку с SVG DATA..

Во вторых проект уже давно не развивается, последняя версия 2006 года. 

Я думал возможно кто-то подскажет более продвинутый редактор SVG.  

Изменено пользователем ENRGY
Ссылка на комментарий
  • 0
8 минут назад, ENRGY сказал:

Во первых PixPower на немецком,  а версии на английском нету.

Во вторых проект уже давно не развивается, последняя версия 2006 года. 

Пора учить немецкий :)

Текущая Версия: 
7.16 от 18.02.2017

Ссылка на комментарий
  • 0

 1. Я вот нашел костыльное решение - делаем SVG в каком то векторном редакторе, сохраняем его в svg и затем грузим на этот сайт https://petercollingridge.appspot.com/svg-editor .
Дальше выбираем Edit (experimеntal) и уже эти циферки можно копировать в TPath - это будет работать, хотя это все не то. Нужно обвести иконку.

2. Возможный вариант номер 2  (не проверял еще).

Adobe Illustrator

http://lessons.livecode.com/m/33498/l/325452-getting-svg-path-data-for-svg-icon-extension

Правда это громадный пакет. Может кто подскажет что получше.

 

 

Изменено пользователем ENRGY
Ссылка на комментарий
  • 0

Ребята я разобрался! Как конвертировать любую картинку в формат TPath для FMX.

Результат - см. png скриншот .

Завтра или послезавтра напишу статью. Нужна прога inkscape, и кое какие манипуляции.

 

 

testvector.png


Пример для автора - векторный прямоугольник с дырой посередине:

Спойлер

 

 - положите TPath на форму. В инспекторе в поле Data вставьте код ниже. Меняйте размер, цвет закраски в Fill и цвет рамки в Stroke полях, и WrapMode.

Чтобы компонент был поверх остальных контролов - правая кнопка мыши по контролу > Control > Bring To Front

M10.1297616958618,148.757736206055 C10.1297616958618,130.236892700195 10.1297616958618,111.716064453125 10.1297616958618,93.1952362060547 C72.8738098144531,93.1952362060547 135.617858886719,93.1952362060547 198.361892700195,93.1952362060547 C198.361892700195,130.236907958984 198.361892700195,167.278564453125 198.361892700195,204.320236206055 C135.617858886719,204.320236206055 72.8738021850586,204.320236206055 10.1297607421875,204.320236206055 C10.1297607421875,185.799392700195 10.1297607421875,167.278564453125 10.1297607421875,148.757736206055 Z M121.271415710449,191.892364501953 C140.307022094727,189.118347167969 160.603515625,182.84098815918 173.259811401367,167.468536376953 C179.926818847656,159.732299804687 180.693664550781,148.353652954102 177.046997070313,139.122909545898 C167.600173950195,122.481338500977 148.677352905273,114.167030334473 130.674224853516,110.43505859375 C103.920913696289,104.999694824219 74.7656555175781,107.082946777344 50.4250106811523,120.101829528809 C39.0806159973145,126.404968261719 27.5140514373779,137.55696105957 28.6953926086426,151.623291015625 C28.596643447876,164.663223266602 39.6976737976074,174.31201171875 50.1407165527344,180.36116027832 C71.6506423950195,192.344253540039 97.1735076904297,194.539932250977 121.271423339844,191.892349243164 Z 

 

 

Изменено пользователем ENRGY
Ссылка на комментарий
  • 0
  • Модераторы
45 минут назад, ENRGY сказал:

Ребята я разобрался! Как конвертировать любую картинку в формат TPath для FMX.

Результат - см. png скриншот .

Завтра или послезавтра напишу статью. Нужна прога inkscape, и кое какие манипуляции.

[TPath] Как составлять TPathData?

Ссылка на комментарий
  • 0

Andrey Efimov

Там еще нужно все пути скомбинировать в один путь, плюс если путь сложный - он будет неправильно отображен (Tpath срежет часть данных), нужно его упростить (Simplify)

krapotkin

Плюс векторных иконок в том, что они масштабируются без квадратиков и размытия. Остаются четкими всегда при любом размере. Хотя согласен иконки лучше оставить в png, но какие то символические картинки большого размера, имхо лучше в векторе.

Еще один плюс, цвет заливки и рамки можно менять в RunTime - иконки могут быть любого цвета, всего лишь указать Fill Color и Stroke Color.

А ведь еще можно и анимацию сделать.

Изменено пользователем ENRGY
Ссылка на комментарий
  • 0
11 часов назад, krapotkin сказал:

png с дыркой вне конкуренции...

К сожалению png не подходит. Вопрос был про контролы в целом и графические примитивы в частности.

Ссылка на комментарий
  • 0
В 22.02.2017 в 17:10, ENRGY сказал:

Пример для автора - векторный прямоугольник с дырой посередине:

  Показать контент

 

 - положите TPath на форму. В инспекторе в поле Data вставьте код ниже. Меняйте размер, цвет закраски в Fill и цвет рамки в Stroke полях, и WrapMode.

Чтобы компонент был поверх остальных контролов - правая кнопка мыши по контролу > Control > Bring To Front

M10.1297616958618,148.757736206055 C10.1297616958618,130.236892700195 10.1297616958618,111.716064453125 10.1297616958618,93.1952362060547 C72.8738098144531,93.1952362060547 135.617858886719,93.1952362060547 198.361892700195,93.1952362060547 C198.361892700195,130.236907958984 198.361892700195,167.278564453125 198.361892700195,204.320236206055 C135.617858886719,204.320236206055 72.8738021850586,204.320236206055 10.1297607421875,204.320236206055 C10.1297607421875,185.799392700195 10.1297607421875,167.278564453125 10.1297607421875,148.757736206055 Z M121.271415710449,191.892364501953 C140.307022094727,189.118347167969 160.603515625,182.84098815918 173.259811401367,167.468536376953 C179.926818847656,159.732299804687 180.693664550781,148.353652954102 177.046997070313,139.122909545898 C167.600173950195,122.481338500977 148.677352905273,114.167030334473 130.674224853516,110.43505859375 C103.920913696289,104.999694824219 74.7656555175781,107.082946777344 50.4250106811523,120.101829528809 C39.0806159973145,126.404968261719 27.5140514373779,137.55696105957 28.6953926086426,151.623291015625 C28.596643447876,164.663223266602 39.6976737976074,174.31201171875 50.1407165527344,180.36116027832 C71.6506423950195,192.344253540039 97.1735076904297,194.539932250977 121.271423339844,191.892349243164 Z 

 

 

Спасибо, это действительно прямоугольник с дырой посередине.

Однако возникает вопрос: как в run-time менять размер и положение "дыры"? В случае с TCircle (как изначально и предполагалось) все очевидно, но тут совершенно не ясно.  

Ссылка на комментарий

Присоединяйтесь к обсуждению

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

Гость
Ответить на вопрос...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

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

  • Последние посетители   0 пользователей онлайн

    • Ни одного зарегистрированного пользователя не просматривает данную страницу
×
×
  • Создать...