Description of the problem
Recently, I found that introducing static images or fonts with large pixels in Flutter resulted in an issue where the frame rate was only 60 on high-brush phones after debugging or packaging.
-
The test device is a Xiaomi 13, which can be used to turn on the frame rate display directly in the developer options.
-
Also available
statsfl
Plug-in display frame rateStatsFl( maxFps: 120, // Support custom FPS target (default is 60) align: , //Alignment of statsbox child: MyApp(), ),
prescription
Big Picture Problems
You can reduce the image resolution as well as compress the image appropriately.
1, PS in the first to convert the image to a smart object, and then resize the image (by pixels), after which the image is saved. Doing so preserves maximum clarity.
- Photopea | Online Photo Editor
- Online PS】PS software web version_ps online image processing tool photopea - Jiangxia Technology Online Application ()
- Online PS】PS software web version, ps online image processing tool photopea - Drafting Design PS ()
2、Picture compression site recommendations
- /ui/compress_img/
- Caesium Image Compressor - Online
Font issues
It can't be done by static fonts, you can download the web fonts locally and load them dynamically.
1、Font initialization tool class
import 'dart:io';
import 'package:flutter/';
import 'package:muen_edu_app/network/dio/dio_instance.dart';
import 'package:muen_edu_app/utils/file_utils.dart';
class FontUtils {
static FontUtils? _instan;
final Map<String, String> fontFamilies = {
"JiangCheng": "",
"SegoeUI": "",
};
final String fontFloder = "fonts";
FontUtils._();
static FontUtils get instan => _instan ??= FontUtils._();
Future initiaFont() async {
String jiangCheng =
await (fontFloder, "");
String segoeUI =
await (fontFloder, "");
await loadFont(File(jiangCheng), "JiangCheng");
await loadFont(File(segoeUI), "SegoeUI");
}
/// Loading Fonts
Future loadFont(File fontFile, String fontFamily) async {
if (!()) {
// No font,Go to download
await downloadFont(fontFamilies[fontFamily]!, fontFamily);
}
Future<ByteData> readFont() async {
ByteData byteData = (await ()).();
return byteData;
}
FontLoader loader = FontLoader(fontFamily);
(readFont());
await ();
}
Future<String> downloadFont(String url, String fontFamily) async {
String savePath =
await (fontFloder, '$');
await (url, savePath);
return savePath;
}
}
2. Documentation tools
import 'dart:io';
import 'package:muen_edu_app/network/dio/dio_instance.dart';
import 'package:path_provider/path_provider.dart';
class FileUtils {
static FileUtils? _ins;
FileUtils._();
static FileUtils get ins {
return _ins ??= FileUtils._();
}
/// Get document catalog file
Future<String> getLocalDocumentFile(String folder, String filename) async {
final dir = await getApplicationDocumentsDirectory();
return '${}/$folder/$filename';
}
/// Getting Temporary Directory Files
Future<String> getLocalTemporaryFile(String folder, String filename) async {
final dir = await getTemporaryDirectory();
return '${}/$folder/$filename';
}
/// Get the application directory file
Future<String> getLocalSupportFile(String folder, String filename) async {
final dir = await getApplicationSupportDirectory();
return '${}/$folder/$filename';
}
}
3. dio download
Future<Response> download(
String url,
String savePath, {
CancelToken? cancelToken,
Options? options,
void Function(int, int)? onReceiveProgress,
}) async {
return await _dio.download(
url,
savePath,
onReceiveProgress: onReceiveProgress,
options: options ??
Options(
method: ,
responseType: ,
receiveTimeout: _defaultTime,
sendTimeout: _defaultTime,
),
);
}
4. Calling the initialization method
();
5. Set the global default font
ThemeData(fontFamily: 'JiangCheng');