Pull to refresh
29
Karma
0
Rating
Кирилл Матросов @sharpfellow

Разработчик

Flutter. Упрощаем компоновку виджетов с помощью Dart расширений

Development of mobile applicationsDartFlutter
Translation

image


В версии Dart 2.7 нам представили расширения, позволяющие разработчикам добавлять новые функциональные возможности в уже существующие типы. Расширения могут быть отличным помощником не только, когда мы пишем бизнес-логику, но и когда у нас есть другие задачи! Примером такой задачи может служить работа с виджетами.


Исходя из своего опыта разработки под iOS, вдохновившись ViewModifier из SwiftUI, я захотел разобраться в том, как использовать Dart расширения аналогичным образом, чтобы уменьшить визуальный беспорядок, который получается при большой вложенности дерева виджетов.


Давайте рассмотрим пример!

Читать дальше →
Total votes 12: ↑11 and ↓1 +10
Views5K
Comments 4

Flutter. Разбираемся, как рисовать различные фигуры с помощью CustomClipper

ProgrammingDevelopment of mobile applicationsDartFlutter
Translation


Flutter предлагает различные виджеты для работы с определенным набором фигур, например, ClipRect, ClipRRect, ClipOval. Но также есть ClipPath, с помощью которого мы можем создавать любые типы фигур.


В данной статье мы сосредоточимся на том, что можно сделать, используя ClipPath и CustomClipper. Поехали!

Читать дальше →
Total votes 13: ↑13 and ↓0 +13
Views4.6K
Comments 3

Как улучшить производительность вашего Flutter приложения

ProgrammingDevelopment of mobile applicationsDartFlutter
Translation


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

Читать дальше →
Total votes 14: ↑14 and ↓0 +14
Views6.2K
Comments 9

Dart. Всё, что надо знать про константы

DartFlutter
Translation
Tutorial


Константы — это не просто странная версия final переменных, которая будет преследовать вас во сне со всеми связанными с ними ошибками. Compile-time константы – это хороший способ повысить производительность вашего приложения, не создавая один и тот же объект несколько раз, а так сказать, «предварительно создавая» объекты во время компиляции.


const или final?


Давайте, разберемся с этим вопросом, прежде чем перейти к более глубокому изучению констант. Со стороны может показаться, что не имеет значения, у вас ключевое слово const или final перед переменной. Эти переменные не могут быть изменены после их объявления.

Читать дальше →
Total votes 8: ↑8 and ↓0 +8
Views4.6K
Comments 2

Вышел Flutter 1.17

DartFlutter
Translation


Сегодня (6 мая 2020) мы с радостью представляем Flutter 1.17, наш первый стабильный релиз в этом году.


Наша цель – выпускать стабильные релизы примерно ежеквартально. Однако, данный релиз занял немного больше времени, потому что мы меняли нашу инфраструктуру для нового процесса релизов. Для нас качество – это приоритет №1, и мы и считаем, что новая модель релизов улучшит поддержку stable ветви.


Релиз 1.17 полон исправлений: беспрецедентное количество (6339) проблем закрыто с момента последнего стабильного релиза 1.12. Во многом такое количество связано с нашим партнерством с Nevercode, который дало возможность лучше реагировать на возникающие проблемы (issue). В этом году мы закрыли больше ошибок, чем было открыто, что привело к сокращению количества проблем до ~800. Многие из этих ошибок были решены с помощью 3164 пулл-реквестов, которые мы получили от 231 контрибьютора. Это огромные цифры, и мы искренне благодарим всех за их работу и вклад, особенно, в это сложное время.


Если вас интересует полный список пулл-реквестов для этого релиза, то посмотрите на нашем сайте flutter.dev. В дополнение к качественным улучшениям нам также удалось внедрить некоторые новые функции в этот релиз, включая поддержку Metal на iOS, новые Material компоненты, новые инструменты отслеживания сети и многое другое! Этот релиз также включает в себя Dart 2.8, о котором вы можете узнать больше в Dart блоге.

Читать дальше →
Total votes 18: ↑16 and ↓2 +14
Views6.3K
Comments 14

Правила компоновки во Flutter, которые должен знать каждый

ProgrammingDartFlutter
Translation


Когда новичок во Flutter спрашивает, почему какой-то виджет с width: 100 не ширины 100 пикселей, обычно ему отвечают, что надо обернуть этот виджет в Center, верно?


Не надо так делать


Если так отвечать, то к вам будут возвращаться снова и снова, спрашивая, почему какой-то FittedBox не работает, почему этот Column переполнен или как работает IntrinsicWidth.


Сначала объясните, что Flutter компоновка очень отличается от HTML компоновки (особенно, если говорите с веб-разработчиком), а затем скажите, что необходимо запомнить следующее правило:


Ограничения для виджетов объявляются в родителях. Размеры (желаемые) задаются в самом виджете. Позиция виджета на экране устанавливается родителем

На мой взгляд, это правило нужно изучить, как можно раньше, так как без него по-настоящему понять компоновку во Flutter нельзя.

Читать дальше →
Total votes 25: ↑25 and ↓0 +25
Views18.9K
Comments 4

В CodePen добавлена поддержка Flutter

Website developmentDevelopment of mobile applicationsDartFlutter
Translation


Сегодня (15 апреля 2020) мы рады сообщить, что CodePen, основная среда разработки для миллионов frontend разработчиков и дизайнеров, добавила поддержку Flutter! Для веб-разработчиков CodePen уже давно является отличным местом для обмена экспериментами по дизайну, новыми подходами и идеями. Теперь с появлением Flutter CodePen предлагает аудитории новые возможности, чтобы учиться, делиться и продвигать свое творчество.


Что говорит Alex Vazquez (один из соучредителей CodePen):

Читать дальше →
Total votes 8: ↑8 and ↓0 +8
Views1.8K
Comments 0

Как работает Flutter

ProgrammingDevelopment of mobile applicationsDartFlutter
Translation


Как Flutter работает на самом деле?


Что такое Widgets, Elements, BuildContext, RenderOject, Bindings?..


Сложность: Новичок


Вступление


В прошлом году (прим: в 2018), когда я начал свое путешествие в сказочный мир Flutter, в Интернете было очень мало информации по сравнению с тем, что есть сегодня. Сейчас, несмотря на то, что уже написано много материалов, лишь небольшая их часть рассказывает о том, как на самом деле работает Flutter.


Что же такое Widgets (виджеты), Elements (элементы), BuildContext? Почему Flutter быстрый? Почему иногда он работает не так, как ожидается? Что такое деревья и зачем они нужны?


В 95% случаев при написании приложения вы будете иметь дело только с виджетами, чтобы что-то отображать на экране или взаимодействовать с ним. Но неужели вы никогда не задумывались, как вся эта магия работает внутри? Как система узнает, когда обновить экран и какие части должны быть обновлены?


Содержание:


Читать дальше →
Total votes 14: ↑13 and ↓1 +12
Views22.7K
Comments 5

Какой здесь this? Внутренняя работа объектов JavaScript

JavaScript
Translation


Фотография: "Любопытный" Liliana Saeb (CC BY 2.0)


JavaScript – это мультипарадигмальный язык, который поддерживает объектно-ориентированное программирование и динамическое связывание. Динамическое связывание — это мощная концепция, которая позволяет изменять структуру JavaScript кода во время выполнения, но эти дополнительные мощность и гибкость достигаются ценой некоторой путаницы, большая часть которой связана с поведением this в JavaScript.


Динамическое связывание


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


Давайте сыграем в игру. Я называю её "Какой здесь this?"

Читать дальше →
Total votes 14: ↑10 and ↓4 +6
Views8.1K
Comments 3

Тестирование производительности Flutter приложений

DartMobile applications testingFlutter
Translation

Фреймворк Flutter по умолчанию работает хорошо и быстро, но означает ли это, что вам вообще не нужно думать о производительности? Нет. Абсолютно реально писать приложения Flutter, которые будут медленными. С другой стороны, также можно использовать фреймворк максимально и делать ваши приложения не только быстрыми, но и эффективными, потребляя меньше времени процессора и батареи.



Это то, что мы хотим видеть: статистически значимый результат сравнения двух версий вашего приложения по какой-то значимой метрике. Читайте дальше, чтобы узнать, как такое получить.

Читать дальше →
Total votes 11: ↑10 and ↓1 +9
Views5.1K
Comments 1

Анонсирован Dart 2.3: оптимизирован для разработки пользовательских интерфейсов

ProgrammingDartFlutter
Translation

Сегодня (8 мая 2019) мы объявляем о релизе Dart 2.3 SDK с новыми языковыми конструкциями, которые улучшают ваш опыт разработки при создании пользовательских интерфейсов, новой поддержкой инструментов для разработки Flutter UI и двумя новыми веб-сайтами: dart.dev и pub.dev.

Читать дальше →
Total votes 16: ↑16 and ↓0 +16
Views10.5K
Comments 4

Flutter. Keys! Для чего они?

ProgrammingDevelopment of mobile applicationsDartFlutter
Translation


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


Данная статья адаптирована из следующего видео. Если вы предпочитаете слушать / смотреть, а не читать, то видео предоставит вам тот же материал.

Читать дальше →
Total votes 9: ↑9 and ↓0 +9
Views18.6K
Comments 3

Работа с камерой во Flutter

ProgrammingDevelopment of mobile applicationsDartFlutter

Возможность задействовать камеру существует во многих приложениях, и мы все регулярно пользуемся ею. Во Flutter мы можем реализовать работу с камерой с помощью двух официальных плагинов:



Между ними – заметная разница, и использовать их стоит по ситуации:


  • camera позволяет взаимодействовать с доступными устройству камерами из вашего приложения и выводить изображение в виджет. Хорошо подходит под задачи, когда надо "кастомизировать" работу камеры под приложение.
  • image-picker запускает приложение камеры и возвращает объект типа File (изображение или видеофайл, выбранный пользователем) в ваше приложение. Также image-picker дает возможность выбора файла из имеющихся на устройстве, при этом, как и в случае камеры, запускается отдельное приложение, после чего в ваше приложение возвращается выбранный объект.



Здесь можно посмотреть исходники.



Читать дальше →
Total votes 7: ↑7 and ↓0 +7
Views7.6K
Comments 4

Dart 2. Асинхронное программирование: потоки данных

ProgrammingDart
Translation
Tutorial

Асинхронное программирование: потоки данных


Содержание



Что важно:


  • Потоки обеспечивают асинхронную последовательность данных.
  • Последовательности данных содержат пользовательские события и данные, считываемые из файлов.
  • Поток можно обработать с помощью await for или listen() из Stream API.
  • Потоки предоставляют способ реагирования на ошибки.
  • Существует два типа потоков: потоки-подписки (single subscription) и широковещательные (broadcast).
Читать дальше →
Total votes 12: ↑12 and ↓0 +12
Views7.3K
Comments 4

Dart 2. Асинхронное программирование: futures

ProgrammingDart
Translation
Tutorial

Асинхронное программирование: futures


Содержание



Что важно:


  • Код в Dart работает в одном треде (прим. thread — поток) выполнения.
  • Из-за кода, который долго занимает (блокирует) тред выполнения, программа может зависнуть.
  • Объекты Future (futures) представляют результаты асинхронных операций — обработки или ввода-вывода, которые будут завершены позже.
  • Чтобы приостановить выполнение до завершения в будущем, используйте await в асинхронной функции (или then() при использовании Future API).
  • Чтобы поймать ошибки, используйте в асинхронной функции конструкцию try-catch (или catchError() при использовании Future API).
  • Для одновременной обработки создайте изолят (или worker для веб-приложения).
Читать дальше →
Total votes 12: ↑12 and ↓0 +12
Views14.7K
Comments 1

Анонсирован Dart 2.2: более производительный машинный код, поддержка Set литералов

ProgrammingDevelopment of mobile applicationsDartFlutter
Sandbox
Источник [Announcing Dart 2.2: Faster native code, support for set literals]

Сегодня (26 февраля 2019) мы объявляем о выпуске Dart 2.2 SDK — обновления для Dart 2, которое предлагает улучшенную производительность ahead-of-time (AOT) кода и поддержку Set литералов.

image
Читать дальше →
Total votes 29: ↑25 and ↓4 +21
Views4.6K
Comments 0

Information

Rating
5,883-rd
Location
Москва, Москва и Московская обл., Россия
Registered
Activity