Brovin Yaroslav

[FGX Native] FlexBox, Йога и AspectRatio

В теме 1 сообщение

О чем эти слова?!?!

Да все о том же, о гибкой системе выравнивания FlexBox и об используемой реализации этой системы Yoga.

На этот раз решаем задачу сохранения пропорций в размерах контролов. Представьте себе. что ваши встраиваемые изображения должны всегда сохранять соотношение сторон 16 к 9. Чтобы такого добиться в VCL и частично в FMX, вам придется написать код. Хоть он и простой, но написать его придется. в FGX Native введено новое свойство AspectRatio для Size. Его основная идея задать соотношение ширины к высоте контрола. А дальше система выравнивания сама все сделает за вас и при изменении ширины или высоты контрола (в зависимости от других настроек) автоматически вычислит высоту или ширину и сохранит пропорцию.

 

2018-05-03_00-49-55.png

2018-05-03_00-50-50.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Гость
Вы комментируете как гость. Если у вас есть аккаунт, пожалуйста, войдите
Ответить в этой теме...

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

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

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

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

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


  • Похожий контент

    • От Brovin Yaroslav
      Первые пробы портирования существующего приложения с FMX на FGX.
      За основу был выбран классный проект Станислава Ихнатовича из Беларуссии с мобильным расписанием, отличающийся от других продуманным интерфейсом и детальной шлифовкой UI.
      Станислав любезно предоставил исходные коды своего проекта. Предлагаю вам ознакомиться с первым наброском его приложения на базе FGX.
      Обратите внимание, на сколько удобно идет создание стиля расписания пары, сделанного на базе компонента TfgCollectionView. В дизайн тайме созданы три варианта стилей без единой строчки кода для отображения расписания одной пары в разных исполнениях. Используя всю мощь FlexBox, удается достигнуть разнообразных вариантов "резинового" выравнивания контролов.
      А связь с данными не размазывается по коду, а сосредоточена вся в одном месте. 
      Меню навигации сделано на базе нового компонента TfgListMenu без единой строчки кода, за исключением обработчиков нажатия на пункты меню и открытия отдельных форм, которым отведена роль отображения экранных страниц.
      Отдельно стоит указать, что специально для данного мобильного приложения была расширена возможность задавать задний фон контролов на базе картинки. А также были расширены возможности отображения и выравнивания форм относительно других. Так например форму можно встроить в любой контрол контейнерного типа, как фрейм. Или же просто отобразить форму, как всплывающее окно.
      P.S. Портирование приложения на FGX Native находится на стадии разработки.





      Screenrecorder-2018-05-28-00-54-39-998.mp4




    • От Brovin Yaroslav
      Практически любое мобильное приложение сложно представить без стандартной навигации. 
      В FMX меню обычно делается на базе TListBox. Однако, при всей гибкости данного компонента 
      зачастую создать меню, которое будет следовать гайдлайнам ОС довольно сложная задача, поскольку 
      она требует хороших навыков работы со стилями.
      Именно с этой целью разработан новый компонент TfgListMenu для FGX Native, который значительно 
      упрощает создание меню навигации в вашем приложении. Компонент полностью построен с использованием 
      концепций материал дизайна для андроида и следует всем его рекомендациям. 
      Данный компонент использует заранее разработанные стили пунктов меню, которые позволяют быстро 
      и гибко создать навигацию по примерам, изображенным ниже.
      Помимо этого компонент поддерживает несколько режимов выделения итемов. Начиная от работы без выделения и заканчивая множественным выделением элементов. На уровне каждого пункта меню в отдельности можно настроить реакцию пукнта меню на выделение и нажатие.

      Screenrecorder-2018-05-23-03-34-12-146.mp4
    • От Brovin Yaroslav
      Приступил к работе над большим демо-проектом, который призван продемонстрировать работу каждого компонента в библиотеке FGX Native. Работа будет продолжаться по мере добавления новых компонентов.
      Данный демо проект нужен не только показать возможности библиотеки, но он так же станет своеобразным наглядным руководством по настройкам компонентов. Ниже представлен пример страницы приложения, посвященный компоненту TfgLabel.

    • От Brovin Yaroslav
      Расширяем границы возможностей одного из самых базовых контролов после кнопки ;-) - TfgEdit.
      Большое количество нововведений, среди которых ряд гибких настроек:
      Правила автоматической расстановки заглавных букв AutocapitalizationType. Настройки типа используемой клавиатуры KeyboardType. Правила автоматической коррекции опечаток в словах AutocorrectionType. Настройки шрифтов Font. Настройки цвета текста Color. TextPrompt - текст подсказка. Настройки пароля IsPassword. Ограничение длины вводимого текста MaxLength. Настройки проверки правописания и выделения ошибок SpellCheckingType. Режим только чтения ReadOnly. ReturnKeyType. А еще было добавлено событие OnTap для всех контролов, которое позволяет отследить именно нажатие на контрол. 
       

    • От Brovin Yaroslav
      Работа над API продолжается. В этот раз руки дошли до асинхронной реализации ShowMessage.
      Впереди еще диалоговые формы ввода строковых данных и классический MessageDlg.
       



    • От Brovin Yaroslav
      Тема: FGX Native. Новейшая кроссплатформенная платформа для мобильной разработки на Delphi Дата и время: 27 марта 2018 года в 12:00 Участники: @Brovin Yaroslav, Андрей Совцов Регистрация: ссылка Ссылка на официальный телеграмм канал: https://t.me/fgx_native Участие бесплатное На вебинаре познакомимся с текущей разработкой новой кроссплатформенной платформы, позволяющей создавать нативные приложения с быстрым откликом, плавной анимацией, продвинутой системой выраванивания, поддержкой RTL языков, оптимизированной работой с изображениями, быстрой канвой и многим другим. RAD Studio, Android/iOS В вебинаре принимает участие автор разработки Ярослав Бровин
       





    • От Brovin Yaroslav
      Добавлен новый компонент - TfgTimer таймер ⏰🕰⌛️
      В отличии от VCL и FMX реализации таймера в FGX по мимо обычных настроек имеет ряд дополнительных, которые расширяют возможностииспользования компонента:
      Возможность выбирать вариант реализации таймера, который будет сказываться на точности работы таймера и принципах его работы (потоковый таймер, системный, на петле событий и тд). В каждой системе существует несколько реализаций таймера, которые между собой отличаются по точности и принципам работы. TfgTimer позволяет выбирать реализацию таймера в зависимости от ваших нужд. Пока реализован стандартный потоковый таймер с синхронизацией с UI потоком. Отсрочка до первого срабатывания таймера Delay.
  • Последние посетители   0 пользователей онлайн

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