5 лучших флаттер-пакетов


1. Общие настройки

URL:

Общие настройки — это простой плагин для разработчиков флаттера. Этот плагин в основном используется для сохранения простых данных, таких как токены, имена пользователей. Общие настройки просты в использовании и могут хранить несколько типов данных.

Чтобы записать данные в общие настройки

// Obtain shared preferences.
final prefs = await SharedPreferences.getInstance();
// the first parameter is called key and second parameter is its value
// to save integer
await prefs.setInt('counter', 10);
// to save boolean
await prefs.setBool('value', true);
// to save double
await prefs.setDouble('decimal', 1.5);
// to save string
await prefs.setString('action', 'Start');
// to save list of strings
await prefs.setStringList('list', <String>['Earth', 'Moon', 'Sun']);
Войти в полноэкранный режим

Выйти из полноэкранного режима

Чтение данных в общие настройки

// Try reading data from the 'counter' key. If it doesn't exist, returns null.
final int? counter = prefs.getInt('counter');
// same goes to all the other data types
Войти в полноэкранный режим

Выйти из полноэкранного режима

Чтобы удалить запись

// Remove data for the 'counter' key.
final success = await prefs.remove('counter');
Войти в полноэкранный режим

Выйти из полноэкранного режима


2. HTTP

URL:

Пакет Http используется для выполнения HTTP-запроса к API. Есть много других пакетов для вызова API, но это официальный и самый простой способ вызова API. Я использую этот пакет во всех своих проектах.

Применение:

// import the package
import 'package:http/http.dart' as http;
// call the url 
var url = Uri.https('example.com', 'whatsit/create');
// get the response
var response = await http.post(url, body: {'name': 'doodle', 'color': 'blue'});
// get the response status code and body
print('Response status: ${response.statusCode}');
print('Response body: ${response.body}');
Войти в полноэкранный режим

Выйти из полноэкранного режима


3. Перейти к маршрутизатору

URL:

Go Router — это пакет декларативной маршрутизации для флаттера. Это означает, что это навигация на основе URL. Он очень прост в использовании и лучше подходит для навигации, чем старый метод.

Применение:

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
void main() => runApp(App());
class App extends StatelessWidget {
  App({Key? key}) : super(key: key);
@override
  Widget build(BuildContext context) {
    return MaterialApp.router(
      routerConfig: _router,
      title: 'GoRouter Example',
    );
  }
final GoRouter _router = GoRouter(
    routes: <GoRoute>[
      GoRoute(
        path: "
        builder: (BuildContext context, GoRouterState state) {
          return ScreenA();
        },
      ),
      GoRoute(
        path: '/page1',
        builder: (BuildContext context, GoRouterState state) {
          return ScreenB();
        },
      ),
    ],
  );
}

Войти в полноэкранный режим

Выйти из полноэкранного режима


4. Шрифты Google

URL:

Вам нужно использовать разные шрифты в вашем приложении? Шрифты Google — это единственный пакет для вас. Он использует шрифты с fonts.google.com, где вы можете проверить шрифты и попробовать их перед использованием в своем приложении. Google Fonts содержит более 1400 шрифтов, и вы можете сразу же использовать любой из них в своем приложении.

Применение:

import 'package:google_fonts/google_fonts.dart';
// using with default textstyle
Text(
  'This is Google Fonts',
  style: GoogleFonts.lato(),
),
// load font dynamically
Text(
  'This is Google Fonts',
  style: GoogleFonts.getFont('Lato'),
),
// using with exisiting text style
Text(
  'This is Google Fonts',
  style: GoogleFonts.lato(
    textStyle: TextStyle(color: Colors.blue, letterSpacing: .5),
  ),
),
Text(
  'This is Google Fonts',
  style: GoogleFonts.lato(textStyle: Theme.of(context).textTheme.headline4),
),
// override the fontSize, fontWeight, fontstyle
Text(
  'This is Google Fonts',
  style: GoogleFonts.lato(
    textStyle: Theme.of(context).textTheme.headline4,
    fontSize: 48,
    fontWeight: FontWeight.w700,
    fontStyle: FontStyle.italic,
  ),
),
Войти в полноэкранный режим

Выйти из полноэкранного режима

но я предпочитаю использовать его на textTheme в main.dart, что очень просто.

перейдите в раздел темы вашего материального приложения и добавьте это

theme: ThemeData(
  fontFamily: "Lato",
  textTheme: GoogleFonts.latoTextTheme(),
),
Войти в полноэкранный режим

Выйти из полноэкранного режима


5. Кэшированное сетевое изображение

URL:

Cache Network Image — это наиболее полезный пакет изображений, который используется для быстрого отображения динамических изображений из Интернета в вашем приложении.

Применение:

CachedNetworkImage(
        imageUrl: "
        placeholder: (context, url) => CircularProgressIndicator(),
        errorWidget: (context, url, error) => Icon(Icons.error),
     ),
Войти в полноэкранный режим

Выйти из полноэкранного режима

Спасибо!

Если вы еще не смотрели мое первое видео на YouTube:
Нажмите здесь, чтобы посмотреть

Подпишись и поставь лайк под видео. СПАСИБО!

Спасибо