Supabase: Привязка анонимного пользователя к аутентифицированному

Анонимный пользователь - это действительно здорово. Вы автоматически создаете нового пользователя в своей базе данных каждый раз, когда кто-то впервые запускает ваше приложение.
Затем вы можете позволить ему подписаться, начать работать с вашим приложением, не беспокоя его просьбой ввести email...
А затем, когда он действительно вовлечется в процесс, вы можете привязать его учетную запись.

@override
Future<Credentials> signup(String email, String password) async {
  if (client.auth.currentUser?.isAnonymous == true) {
    // Обновляем анонимного пользователя с помощью email и password
    final res = await client.auth.updateUser(UserAttributes(email: email, password: password));
    if (res.user != null) {
      return Credentials(id: res.user!.id);
    } else {
      throw 'Ошибка при обновлении пользователя';
    }
  }
  return client.auth
      .signUp(email: email, password: password)
      .then(
        (value) => Credentials(id: value.user!.id),
        onError: (error) {
          Logger().e("Ошибка при регистрации: $error");
          throw SignupException();
        },
      );
}

Оцените новую рубрику и напишите свое мнение! 👍💬

Все подобные новости можно найти по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #Supabase #MobileDev #AppDev #CodingTips #DevTips

Flutter-дайджест сентября 🌐

Сентябрь выдался ярким месяцем для Flutter-разработчиков: статьи на Хабре, новые пакеты и мощные обновления, разборы на YouTube и полезные советы для прокачки проектов 🚀

В дайджесте вы найдёте:

🎓 статьи с Хабра (RenderObject, CI/CD, хитрости релиза в сторы);
🎥 лучшие видео (FFI + Rust, Talker, сборка бинарников);
📦 топовые пакеты месяца (flutter_slidable, go_router, drift, flutter_map, Firebase и др.);
🆕 новые пакеты недели (bodychart_heatmap, fquery, isar_plus, loader_pro, cupertino_native);
💡 #FlutterPulseTips (кастомные переходы страниц, точный таймер, лайфхаки с формами).

Полный обзор читайте 👉 здесь

Давайте вместе вспомним что произошло за прошедший месяц

#Flutter #Dart #FlutterPulse #PubDev #Хабр #MobileDev

Привет всем! ✌️ Руслан продолжает свой увлекательный эксперимент по созданию приложения для генерации скетчей во Flutter. В этом выпуске — сразу несколько крутых обновлений! 🚀

Сегодня мы не просто кодим, а погружаемся в вайб и улучшаем наш проект:

✨ Улучшаем промпт для генерации более реалистичных и точных скетчей, которые теперь лучше понимают, что хочет пользователь.
✨ Обновляем дизайн, внедряя элементы стиля LiquidGlass — делаем интерфейс современным и стильным.
✨ Проводим рефакторинг — убираем лишний код, упрощаем архитектуру и делаем приложение более читаемым и поддерживаемым.

В видео вы увидите:
🔹 Как работать с библиотекой Liquid Glass для создания красивых UI-эффектов.
🔹 Как правильно выносить код в отдельные виджеты и файлы.
🔹 Как добавить анимации нажатия на кнопки с помощью Implicit Animations.
🔹 Как избежать race condition при множественных запросах.

Если вам интересно продолжение — например, как публиковать такое приложение или есть идеи по улучшению — оставляйте комментарии прямо под видео! 💬

🔗 Ссылка на видео: Vibe coding. Приложение для скетчей с нуля. Часть 3

📩 Связаться с Русланом: https://t.me/ruslan_tsitser

Обязательно посмотрите и другие видео по хэштегу #FlutterPulseYoutube! 🎥

#Flutter #Dart #FlutterPulse #FlutterPulseTips #FlutterPulseYoutube #Refactoring #CleanCode #FlutterArchitecture #StatefulWidget #ComponentBasedUI #fluttertutorial

Полезные конфигурации VSCode для экономии времени

VSCode позволяет запускать код при сохранении или включить автоматическое форматирование... Вот несколько конфигураций, которые сэкономят ваше время!

{
  "editor.formatOnSave": true,
  "[dart]": {
    "editor.formatOnSave": false, // Автоматически форматировать dart файлы (вкл/выкл)
    "editor.inlayHints.enabled": "off",
    "editor.codeActionsOnSave": {
      "source.fixAll": "explicit", // Автоматически исправлять весь код при явном сохранении dart файла
      "source.organizeImports": "explicit" // Автоматически исправлять код (добавлять const...) при сохранении dart файла
    }
  }
}

Отключение отображения типов переменных серым цветом

Оцените новую рубрику и оставьте свои комментарии! 👍💬 Все подобные новости можно найти по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #VSCode #ProductivityTips #CodingTips #FlutterDev #DartLang

Что такое Render Objects?

Render Objects являются основой визуальной системы Flutter. Они используются для отрисовки элементов интерфейса на экране.

Flutter строит пользовательские интерфейсы в три слоя:
1. Widget: конфигурация визуального элемента
2. Element: соединяет виджеты и объекты рендеринга
3. RenderObject: рисует на вашем экране

Настройка RenderObject
Поскольку мы будем рендерить одного потомка, мы расширяем SingleChildRenderObjectWidget.

Render Objects рисуют как CustomPainter, но с гораздо большими возможностями:
- Могут иметь потомков и реагировать на ограничения макета
- Управляют как макетом, так и отрисовкой
- Обрабатывают ограничения макета
- Управляют своим собственным размером

Зачем использовать RenderObject?
Большую часть времени вам не придётся писать RenderObjects самостоятельно. Используйте виджеты!
Но пользовательские RenderObjects дают неограниченную творческую свободу для нестандартных виджетов.

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: const Center(
        child: CustomStar(
          size: 200,
          color: Colors.amber,
        ),
      ),
    );
  }
}

class CustomStar extends SingleChildRenderObjectWidget {
  final double size;
  final Color color;

  const CustomStar({
    super.key,
    required this.size,
    required this.color,
  });

  @override
  RenderObject createRenderObject(BuildContext context) {
    return RenderCustomStar(size: size, color: color);
  }

  @override
  void updateRenderObject(BuildContext context, RenderCustomStar renderObject) {
    renderObject.starSize = size;
    renderObject.color = color;
  }
}

class RenderCustomStar extends RenderBox {
  RenderCustomStar({
    required double size,
    required Color color,
  })  : starSize = size,
        color = color;

  double starSize;
  Color color;

  @override
  void performLayout() {
    size = constraints.biggest;
  }

  @override
  void paint(PaintingContext context, Offset offset) {
    final canvas = context.canvas;
    canvas.save();
    canvas.translate(offset.dx, offset.dy);
    // ... рисуйте то, что вам нужно здесь
  }
}

Оцените новую рубрику лайком! 👍
Все подобные новости можно найти по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #mobiledev #renderobjects #flutterrenderobjects #flutterui #flutterdevelopment #codingtips

Масштабирование изображения

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


InteractiveViewer(
key: previewWidgetKey,
transformationController: TransformationController()..value = (Matrix4.identity()..scale(scale)), // масштабирование
scaleEnabled: false,
constrained: false,
panEnabled: false,
clipBehavior: Clip.antiAlias,
child: Image.asset("name_of_your_image.png"), // ваше изображение
)


Как это работает?

Матрица 4x4 используется для трансформации:

[ m00 m01 m02 m03 ]
[ m10 m11 m12 m13 ]
[ m20 m21 m22 m23 ]
[ m30 m31 m32 m33 ]

- Левый верхний 3x3 блок отвечает за вращение и масштабирование.
- Последний столбец (m03, m13, m23) используется для перемещения объектов.
- Нижняя строка используется для перспективных трансформаций (для 3D-эффектов).

Если масштаб < 1, мы приближаем изображение.
Если масштаб > 1, мы отдаляем изображение.

Оцените нашу новую рубрику! 👍 Оставляйте ваши отзывы в комментариях! 💬

Все подобные советы можно найти по хэштегу #FlutterPulseTips

#flutter #dart #flutterpulse #FlutterPulseTips #MobileDevelopment #UIUX #CodingTips #AppDevelopment

Проверка разрешений

iOS и Android требуют, чтобы вы запрашивали разрешение перед выполнением определенных действий, таких как съемка фотографии, сохранение в галерею пользователя или запись звука.

1. Установка и импорт плагина permission_handler

import 'package:permission_handler/permission_handler.dart';

2. Как использовать

// Запрос одного разрешения
[Permission.camera].request()

// Запрос нескольких разрешений (цепочка запросов)
[Permission.camera, Permission.microphone].request()

// Просто проверка статуса разрешения
final cameraPermission = await Permission.camera.status;
final microphonePermission = await Permission.microphone.status;

3. Пример использования

@override
Widget build(BuildContext context) {
  return CameraPermission(
    child: CameraAwesomeBuilder.custom(
      builder: (state, preview) {
        ...
      },
    ),
  );
}

Создайте виджет (CameraPermission) здесь. Перед запуском камеры мы проверяем, дал ли пользователь все необходимые разрешения. В противном случае мы показываем виджет, который вежливо просит разрешить доступ + кнопку для открытия настроек.

Оцените новую рубрику! 👍💬 Нам важно ваше мнение! 🤔

Все подобные новости можно найти по хэштегу #FlutterPulseTips

#flutter #dart #flutterpulse #FlutterPulseTips #MobileDev #AppDev #ProgrammingTips #DevTips

Null-Aware элементы
Dart 3.8 ввёл действительно практичную новую функцию языка, называемую null-aware элементами. Она позволяет уменьшить количество шаблонного кода для проверки null элементов перед их отображением.

До:

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Column(
      children: [
        if (title != null)
          title
        ...
      ]
    )
  );
}

После:

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Column(
      children: [
        ?title <----- 
        ...
      ]
    )
  );
}

Оцените новую рубрику лайком 👍, если считаете её полезной! 💡
Все подобные новости можно найти по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #DartLanguage #NullAware #CodingTips #MobileDevelopment #FlutterTips

1..2..3... Гонка Future

Представьте, что вы ждёте ответ от нескольких источников. Но вам нужен только один ответ. Ладно, такое случается не часто, но представьте...

Ждём только 1 ответ

Будьте осторожны, если первый запрос выдаёт ошибку до того, как придёт второй ответ... Future завершится с ошибкой. Значит, вам нужно игнорировать эту ошибку в вашем будущем запросе.

import 'dart:async';
import 'package:http/http.dart' as http;

void main() async {
  await Future.any([
    getPost(SERVER_1), // первый сервер
    getPost(SERVER_2), // второй сервер
  ]);
}

Future<String> getPost(String url) async {
  final response = await http.get(Uri.parse('....'));
  if (response.statusCode == 200) {
    return response.body; // возвращаем тело ответа
  } else {
    throw Exception('Не удалось загрузить пост'); // выбрасываем исключение
  }
}

Что возвращает Future.any?
Он возвращает Future, который завершается с первым результатом. Вы можете передать несколько Future разных типов.

Оцените новую рубрику! 👍💡 Все подобные новости можно найти по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #FutureAny #AsyncProgramming #FlutterTips #MobileDevelopment #ProgrammingTips

Ждём готовности представления

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

Чтобы добиться желаемого результата, следуйте простым шагам:
1. Создайте StatefulWidget.
2. В методе initState вызовите WidgetsBinding.instance.addPostFrameCallback.

@override
void initState() {
  super.initState();
  WidgetsBinding.instance.addPostFrameCallback((_) {
    // ваш код здесь
  });
}

Преимущества использования addPostFrameCallback:
- Гарантия, что код выполнится после полной готовности представления.
- Избежание случайных задержек, которые могут не сработать в нужный момент.

Не злоупотребляйте этим методом! В большинстве случаев можно найти альтернативные решения, которые позволят выполнить код позже без использования addPostFrameCallback.

Оцените новую рубрику и оставьте свои комментарии! 👍💬

Все подобные советы ищите по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #MobileDevTips #AppDev #FlutterTips #DartLang

Почему все так НЕНАВИДЯТ Flutter? Стоит ли пробовать? 🌟

Предлагаем вам посмотреть интересное видео на нашем канале, в котором Стас Ильин подробно разбирает причины хейта вокруг Flutter. 🤔

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

В этом видео автор телеграм канала, который уже 7 лет занимается разработкой на Flutter, разбирает основные аргументы против этого фреймворка и объясняет, почему они не имеют под собой оснований. 🔍

Основные темы видео: 📚
🔹 UI и рендеринг: почему Flutter рисует всё сам и как это влияет на производительность. 🎨
🔹 Перформанс: как Flutter справляется с производительностью и почему он не уступает нативным приложениям. 🚀
🔹 Вес приложения: почему размер приложения не является проблемой. 📦
🔹 Экосистема: как Flutter развивается и становится всё более популярным. 🌟
🔹 Платформа: почему интеграция с платформой не является проблемой. 📈
🔹 Большие компании: почему они используют Flutter и как он помогает им экономить. 💸

Итог: 🤔 Основная причина хейта вокруг Flutter - это нежелание компаний терять деньги на разработке и страх разработчиков изучать новые технологии. 💸

Смотрите видео полностью на YouTube: Почему все так НЕНАВИДЯТ Flutter? Стоит ли пробовать? 📹

👉 Подпишитесь на наш Telegram-канал и следите за новыми видео по хэштегу #FlutterPulseYoutube! 📱

#Flutter #Dart #FlutterPulse #FlutterPulseTips #FlutterPulseYoutube

A/B тестирование иконок приложения в Apple Store

Иконка приложения действительно важна. Хорошая иконка может удвоить количество загрузок. И лучший способ это выяснить? Протестировать иконку и увидеть результаты.

Шаги для A/B тестирования иконок приложения:

1 - Откройте Xcode и создайте несколько иконок.
2 - Выберите этот пункт, обратите внимание, что имя иконки по умолчанию - это имя, которое мы предоставляем в активах.
3 - Отправьте новую сборку и дождитесь ее валидации.
4 - Создайте новую "оптимизацию страницы продукта".


# Пример кода для создания альтернативных иконок
// Создание альтернативных иконок в Xcode
// Шаг 1: Откройте Xcode и перейдите в раздел Assets
// Шаг 2: Создайте новые наборы иконок
// Шаг 3: Настройте Info.plist для использования альтернативных иконок
<key>CFBundleIcons</key>
<dict>
<key>CFBundleAlternateIcons</key>
<dict>
<key>MyAlternateIcon</key>
<dict>
<key>CFBundleIconFiles</key>
<array>
<string>alternate-icon</string>
</array>
</dict>
</dict>
</dict>


Теперь вам нужно отправить этот тест на валидацию (снова).

Советы:
- Предпочитайте делать только одно изменение за тест.
- Не меняйте скриншоты при смене иконки. Так вы будете знать, что отвечает за новые данные.

Оцените новую рубрику и напишите свое мнение! 👍💬

Все подобные новости можно найти по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #MobileAppDevelopment #AppStoreOptimization #ABTesting #UIUX #AppDesign #FlutterTips

Сегодня это последняя новость вашей любимой рубрики 😢… Но не грустите! Уже в понедельник мы выкатим рубрику ещё круче — держитесь! 💥 Наш канал растёт вместе с вами, так что готовьтесь к новому уровню!
Fail fast - debug fast
Иногда наш API падает, но мы этого не видим напрямую. В результате мы переходим от файла к файлу или читаем логи. Вместо этого мы можем заставить отладчик остановиться сразу же, даже если мы обработали эту ошибку.

@pragma('vm:notify-debugger-on-exception')
void getUser() {
  final response = await http.get(Uri.parse('...'));
  if (response.statusCode == 200) {
    return ...;
  }
  throw Exception('Не удалось загрузить пост2'); // Failed to load post2
}

Эта директива "vm:notify-debugger-on-exception" остановит выполнение в этом методе всякий раз, когда возникает ошибка в режиме отладки. В продакшене ничего не произойдет.

Оцените лайком последнюю новость в этой рубрике! 👍💬
#FlutterPulseTips нам тебя будет не хватать....

Все подобные новости можно найти по хэштегу #FlutterPulseTips
#flutter #dart #flutterpulse #FlutterPulseTips #debug #tips #coding #mobiledev #programming #productivity