高级进阶 Flutter for OpenHarmony 第三方库实战:screen——屏幕工具
场景一:视频播放应用需要控制屏幕亮度并保持常亮场景二:阅读应用需要保持屏幕常亮防止阅读时屏幕休眠场景三:夜间模式应用需要调节屏幕亮度场景四:游戏应用需要保持屏幕常亮提升游戏体验场景五:图像编辑应用需要根据内容调节亮度screen是 Flutter 中简单高效的屏幕管理插件!它提供了屏幕亮度控制和保持屏幕常亮的核心功能,在 OpenHarmony 平台上基于鸿蒙原生窗口管理服务实现。

欢迎加入开源鸿蒙跨平台社区:https://openharmonycrossplatform.csdn.net
🎯 欢迎来到 Flutter for OpenHarmony 社区!本文将深入讲解 Flutter 中
screen插件的使用方法,带你全面掌握在应用中控制屏幕亮度、保持屏幕常亮的完整流程。
🎯 前言:为什么需要屏幕工具?
在移动应用开发中,屏幕管理是许多应用的核心功能:
场景一:视频播放应用需要控制屏幕亮度并保持常亮
场景二:阅读应用需要保持屏幕常亮防止阅读时屏幕休眠
场景三:夜间模式应用需要调节屏幕亮度
场景四:游戏应用需要保持屏幕常亮提升游戏体验
场景五:图像编辑应用需要根据内容调节亮度
screen 是 Flutter 中简单高效的屏幕管理插件!它提供了屏幕亮度控制和保持屏幕常亮的核心功能,在 OpenHarmony 平台上基于鸿蒙原生窗口管理服务实现。
🚀 核心能力一览
| 功能特性 | 详细说明 | OpenHarmony 支持 |
|---|---|---|
| 获取屏幕亮度 | 获取当前屏幕亮度值 | ✅ |
| 设置屏幕亮度 | 调节屏幕亮度 | ✅ |
| 检查常亮状态 | 检查是否保持屏幕常亮 | ✅ |
| 设置保持常亮 | 控制屏幕是否保持常亮 | ✅ |
支持的功能
| 功能 | 说明 | OpenHarmony 支持 |
|---|---|---|
| brightness | 获取当前屏幕亮度 | ✅ |
| setBrightness | 设置屏幕亮度 | ✅ |
| isKeptOn | 检查是否保持常亮 | ✅ |
| keepOn | 设置保持常亮 | ✅ |
⚙️ 环境准备
第一步:添加依赖
📄 pubspec.yaml:
dependencies:
flutter:
sdk: flutter
# 添加 screen 依赖(OpenHarmony 适配版本)
screen:
git:
url: https://atomgit.com/openharmony-sig/fluttertpc_screen.git
执行命令:
flutter pub get
第二步:配置权限
screen 插件在 OpenHarmony 平台上无需特殊权限配置。
📸 场景一:屏幕亮度控制
📝 完整代码
import 'package:flutter/material.dart';
import 'package:screen/screen.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
Widget build(BuildContext context) {
return MaterialApp(
title: '屏幕亮度控制',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: const Color(0xFF2196F3)),
useMaterial3: true,
),
home: const BrightnessControlPage(),
);
}
}
class BrightnessControlPage extends StatefulWidget {
const BrightnessControlPage({super.key});
State<BrightnessControlPage> createState() => _BrightnessControlPageState();
}
class _BrightnessControlPageState extends State<BrightnessControlPage> {
double _brightness = 1.0;
void initState() {
super.initState();
_initBrightness();
}
// 初始化获取当前亮度
Future<void> _initBrightness() async {
final brightness = await Screen.brightness;
setState(() {
_brightness = brightness;
});
}
// 设置亮度
Future<void> _setBrightness(double value) async {
setState(() {
_brightness = value;
});
await Screen.setBrightness(value);
}
// 重置亮度
Future<void> _resetBrightness() async {
await _setBrightness(1.0);
}
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('屏幕亮度控制'),
actions: [
IconButton(
icon: const Icon(Icons.refresh),
onPressed: _initBrightness,
tooltip: '刷新',
),
],
),
body: Padding(
padding: const EdgeInsets.all(24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
// 亮度显示卡片
Card(
color: Colors.grey[100],
child: Padding(
padding: const EdgeInsets.all(24),
child: Column(
children: [
Icon(
Icons.brightness_6,
size: 80,
color: Colors.amber[800],
),
const SizedBox(height: 16),
Text(
'当前亮度: ${(_brightness * 100).toInt()}%',
style: Theme.of(context).textTheme.headlineSmall,
),
const SizedBox(height: 8),
Text(
'值: $_brightness',
style: Theme.of(context).textTheme.bodyMedium,
),
],
),
),
),
const SizedBox(height: 24),
// 亮度滑块
Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Icon(Icons.brightness_4),
const Text('调节屏幕亮度'),
const Icon(Icons.brightness_7),
],
),
Slider(
value: _brightness,
min: 0.0,
max: 1.0,
divisions: 100,
label: '${(_brightness * 100).toInt()}%',
onChanged: _setBrightness,
),
],
),
const SizedBox(height: 16),
// 预设亮度按钮
Wrap(
spacing: 8,
children: [
ElevatedButton.icon(
onPressed: () => _setBrightness(0.1),
icon: const Icon(Icons.brightness_2),
label: const Text('10%'),
),
ElevatedButton.icon(
onPressed: () => _setBrightness(0.3),
icon: const Icon(Icons.brightness_3),
label: const Text('30%'),
),
ElevatedButton.icon(
onPressed: () => _setBrightness(0.5),
icon: const Icon(Icons.brightness_5),
label: const Text('50%'),
),
ElevatedButton.icon(
onPressed: () => _setBrightness(0.7),
icon: const Icon(Icons.brightness_6),
label: const Text('70%'),
),
ElevatedButton.icon(
onPressed: () => _setBrightness(0.9),
icon: const Icon(Icons.brightness_7),
label: const Text('90%'),
),
],
),
const SizedBox(height: 16),
// 重置按钮
OutlinedButton.icon(
onPressed: _resetBrightness,
icon: const Icon(Icons.refresh),
label: const Text('重置亮度到默认'),
),
const Spacer(),
// 说明卡片
Card(
color: Colors.blue[50],
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
Row(
children: [
Icon(Icons.info_outline, color: Colors.blue),
SizedBox(width: 8),
Text(
'使用说明',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16,
),
),
],
),
SizedBox(height: 8),
Text('• 亮度范围:0.0 到 1.0(0% 到 100%)'),
Text('• 1.0 表示系统默认亮度'),
Text('• 拖动滑块实时调节屏幕亮度'),
Text('• 点击预设按钮快速设置常用亮度'),
],
),
),
),
],
),
),
);
}
}
🔑 关键点解析
- Screen.brightness:获取当前屏幕亮度值(0.0-1.0)
- Screen.setBrightness():设置屏幕亮度
- 状态管理:使用 setState 实时更新 UI
- 滑块控制:提供 0-1 范围的滑块,分 100 份
- 预设按钮:提供常用亮度快捷设置
🎨 场景二:保持屏幕常亮

📝 完整代码
import 'package:flutter/material.dart';
import 'package:screen/screen.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
Widget build(BuildContext context) {
return MaterialApp(
title: '保持屏幕常亮',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: const Color(0xFF4CAF50)),
useMaterial3: true,
),
home: const KeepOnPage(),
);
}
}
class KeepOnPage extends StatefulWidget {
const KeepOnPage({super.key});
State<KeepOnPage> createState() => _KeepOnPageState();
}
class _KeepOnPageState extends State<KeepOnPage> {
bool _isKeptOn = false;
void initState() {
super.initState();
_checkKeepOn();
}
// 检查当前常亮状态
Future<void> _checkKeepOn() async {
final keptOn = await Screen.isKeptOn;
setState(() {
_isKeptOn = keptOn;
});
}
// 切换常亮状态
Future<void> _toggleKeepOn(bool value) async {
await Screen.keepOn(value);
setState(() {
_isKeptOn = value;
});
}
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('保持屏幕常亮'),
actions: [
IconButton(
icon: const Icon(Icons.refresh),
onPressed: _checkKeepOn,
tooltip: '刷新状态',
),
],
),
body: Padding(
padding: const EdgeInsets.all(24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
// 状态显示卡片
Card(
color: _isKeptOn ? Colors.green[100] : Colors.grey[200],
child: Padding(
padding: const EdgeInsets.all(24),
child: Column(
children: [
Icon(
_isKeptOn ? Icons.screen_lock_portrait : Icons.screen_lock_portrait_outlined,
size: 80,
color: _isKeptOn ? Colors.green : Colors.grey,
),
const SizedBox(height: 16),
Text(
_isKeptOn ? '屏幕常亮已开启' : '屏幕常亮已关闭',
style: Theme.of(context).textTheme.headlineSmall,
),
const SizedBox(height: 8),
Text(
_isKeptOn ? '屏幕将不会休眠' : '屏幕会按系统设置休眠',
style: Theme.of(context).textTheme.bodyMedium,
),
],
),
),
),
const SizedBox(height: 24),
// 控制开关
SwitchListTile(
title: const Text('保持屏幕常亮'),
subtitle: Text(_isKeptOn ? '开启' : '关闭'),
value: _isKeptOn,
onChanged: _toggleKeepOn,
secondary: Icon(
_isKeptOn ? Icons.lock : Icons.lock_open,
color: _isKeptOn ? Colors.green : Colors.grey,
),
),
const SizedBox(height: 16),
// 说明卡片
Card(
color: Colors.orange[50],
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Icon(Icons.warning, color: Colors.orange),
SizedBox(width: 8),
Text(
'注意事项',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16,
),
),
],
),
SizedBox(height: 8),
Text('• 开启常亮会增加耗电量'),
Text('• 适用于视频播放、阅读等场景'),
Text('• 应用进入后台时可能失效'),
Text('• 需要系统权限支持'),
],
),
),
),
const Spacer(),
// 使用场景示例
Card(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'适用场景',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16,
),
),
const SizedBox(height: 12),
_buildScenarioItem('🎬', '视频播放器'),
_buildScenarioItem('📚', '电子书阅读'),
_buildScenarioItem('🎮', '游戏应用'),
_buildScenarioItem('📱', '长时间表单填写'),
],
),
),
),
],
),
),
);
}
Widget _buildScenarioItem(String emoji, String text) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 4),
child: Row(
children: [
Text(emoji, style: const TextStyle(fontSize: 20)),
const SizedBox(width: 8),
Expanded(
child: Text(text),
),
],
),
);
}
}
🔑 关键点解析
- Screen.isKeptOn():检查当前是否保持常亮
- Screen.keepOn():设置是否保持常亮
- 状态显示:用图标和颜色直观显示状态
- Switch 控件:提供简单的开关切换
- 场景说明:说明适用场景和注意事项
📊 场景三:综合应用(亮度+常亮)
📝 完整代码
import 'package:flutter/material.dart';
import 'package:screen/screen.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
Widget build(BuildContext context) {
return MaterialApp(
title: '屏幕管理综合应用',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: const Color(0xFFFF9800)),
useMaterial3: true,
),
home: const ScreenManagerPage(),
);
}
}
class ScreenManagerPage extends StatefulWidget {
const ScreenManagerPage({super.key});
State<ScreenManagerPage> createState() => _ScreenManagerPageState();
}
class _ScreenManagerPageState extends State<ScreenManagerPage> {
bool _isKeptOn = false;
double _brightness = 1.0;
bool _isLoading = false;
void initState() {
super.initState();
_initScreenStatus();
}
// 初始化屏幕状态
Future<void> _initScreenStatus() async {
setState(() {
_isLoading = true;
});
try {
final keptOn = await Screen.isKeptOn;
final brightness = await Screen.brightness;
setState(() {
_isKeptOn = keptOn;
_brightness = brightness.toDouble();
});
} catch (e) {
print('获取屏幕状态失败: $e');
} finally {
setState(() {
_isLoading = false;
});
}
}
// 设置亮度
Future<void> _setBrightness(double value) async {
setState(() {
_brightness = value;
});
try {
await Screen.setBrightness(value);
} catch (e) {
print('设置亮度失败: $e');
}
}
// 切换常亮
Future<void> _toggleKeepOn(bool value) async {
setState(() {
_isKeptOn = value;
});
try {
await Screen.keepOn(value);
} catch (e) {
print('设置常亮失败: $e');
}
}
// 一键开启观影模式
Future<void> _enableMovieMode() async {
await _setBrightness(0.6);
await _toggleKeepOn(true);
}
// 一键关闭观影模式
Future<void> _disableMovieMode() async {
await _setBrightness(1.0);
await _toggleKeepOn(false);
}
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('屏幕管理综合应用'),
actions: [
IconButton(
icon: const Icon(Icons.refresh),
onPressed: _initScreenStatus,
tooltip: '刷新状态',
),
],
),
body: _isLoading
? const Center(child: CircularProgressIndicator())
: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
// 状态卡片
Row(
children: [
Expanded(
child: Card(
color: _isKeptOn ? Colors.green[100] : Colors.grey[200],
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
children: [
Icon(
_isKeptOn ? Icons.screen_lock_portrait : Icons.screen_lock_portrait_outlined,
size: 48,
color: _isKeptOn ? Colors.green : Colors.grey,
),
const SizedBox(height: 8),
Text(
_isKeptOn ? '常亮:开启' : '常亮:关闭',
style: Theme.of(context).textTheme.titleMedium,
),
],
),
),
),
),
const SizedBox(width: 16),
Expanded(
child: Card(
color: Colors.amber[100],
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
children: [
Icon(
Icons.brightness_6,
size: 48,
color: Colors.amber[800],
),
const SizedBox(height: 8),
Text(
'亮度:${(_brightness * 100).toInt()}%',
style: Theme.of(context).textTheme.titleMedium,
),
],
),
),
),
),
],
),
const SizedBox(height: 16),
// 亮度控制
Card(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Icon(Icons.brightness_4),
const Text('屏幕亮度'),
Text(
'${(_brightness * 100).toInt()}%',
style: const TextStyle(fontWeight: FontWeight.bold),
),
],
),
Slider(
value: _brightness,
min: 0.0,
max: 1.0,
divisions: 100,
onChanged: _setBrightness,
),
// 快速预设
Wrap(
spacing: 8,
runSpacing: 8,
children: [
OutlinedButton(
onPressed: () => _setBrightness(0.1),
child: const Text('10%'),
),
OutlinedButton(
onPressed: () => _setBrightness(0.3),
child: const Text('30%'),
),
OutlinedButton(
onPressed: () => _setBrightness(0.5),
child: const Text('50%'),
),
OutlinedButton(
onPressed: () => _setBrightness(0.7),
child: const Text('70%'),
),
OutlinedButton(
onPressed: () => _setBrightness(1.0),
child: const Text('100%'),
),
],
),
],
),
),
),
const SizedBox(height: 16),
// 常亮控制
Card(
child: SwitchListTile(
title: const Text('保持屏幕常亮'),
subtitle: Text(_isKeptOn ? '屏幕将不会休眠' : '屏幕会按系统设置休眠'),
value: _isKeptOn,
onChanged: _toggleKeepOn,
secondary: Icon(
_isKeptOn ? Icons.lock : Icons.lock_open,
color: _isKeptOn ? Colors.green : Colors.grey,
),
),
),
const SizedBox(height: 16),
// 快捷模式
Row(
children: [
Expanded(
child: ElevatedButton.icon(
onPressed: _enableMovieMode,
icon: const Icon(Icons.movie),
label: const Text('观影模式'),
style: ElevatedButton.styleFrom(
backgroundColor: Colors.purple,
foregroundColor: Colors.white,
),
),
),
const SizedBox(width: 16),
Expanded(
child: ElevatedButton.icon(
onPressed: _disableMovieMode,
icon: const Icon(Icons.light_mode),
label: const Text('恢复正常'),
style: ElevatedButton.styleFrom(
backgroundColor: Colors.grey,
),
),
),
],
),
const Spacer(),
// 提示信息
Card(
color: Colors.blue[50],
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
Row(
children: [
Icon(Icons.info_outline, color: Colors.blue),
SizedBox(width: 8),
Text(
'提示',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16,
),
),
],
),
SizedBox(height: 8),
Text('• 观影模式:亮度60%,保持常亮'),
Text('• 适用于视频播放、阅读等场景'),
Text('• 恢复正常:亮度100%,关闭常亮'),
],
),
),
),
],
),
),
);
}
}
🔑 关键点解析
- 综合管理:同时管理亮度和常亮状态
- 观影模式:一键设置适合观影的屏幕配置
- 错误处理:添加 try-catch 异常处理
- 加载状态:显示加载指示器
- 状态卡片:直观显示当前状态
📚 API 参考
Screen 静态方法
| 方法 | 返回值 | 说明 | OpenHarmony 支持 |
|---|---|---|---|
| brightness | Future | 获取当前屏幕亮度 | ✅ |
| setBrightness(double) | Future | 设置屏幕亮度 | ✅ |
| isKeptOn() | Future | 检查是否保持常亮 | ✅ |
| keepOn(bool) | Future | 设置是否保持常亮 | ✅ |
参数说明
| 参数 | 类型 | 范围 | 说明 |
|---|---|---|---|
| brightness | double | 0.0 - 1.0 | 屏幕亮度值(0-100%) |
| on | bool | - | 是否保持屏幕常亮 |
返回值说明
| 返回值 | 类型 | 说明 |
|---|---|---|
| brightness | double | 0.0-1.0 之间的亮度值 |
| isKeptOn | bool | true 表示保持常亮,false 表示不保持 |
🎓 最佳实践
1. 初始化检查
void initState() {
super.initState();
_initScreenStatus();
}
Future<void> _initScreenStatus() async {
final keptOn = await Screen.isKeptOn;
final brightness = await Screen.brightness;
setState(() {
_isKeptOn = keptOn;
_brightness = brightness;
});
}
2. 错误处理
try {
await Screen.setBrightness(0.5);
} catch (e) {
print('设置亮度失败: $e');
// 显示错误提示
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('设置亮度失败')),
);
}
3. 保存用户偏好
// 结合 shared_preferences 保存用户偏好
Future<void> _savePreferences() async {
final prefs = await SharedPreferences.getInstance();
await prefs.setDouble('screen_brightness', _brightness);
await prefs.setBool('keep_on', _isKeptOn);
}
Future<void> _loadPreferences() async {
final prefs = await SharedPreferences.getInstance();
setState(() {
_brightness = prefs.getDouble('screen_brightness') ?? 1.0;
_isKeptOn = prefs.getBool('keep_on') ?? false;
});
await _applySettings();
}
4. 场景化配置
// 阅读模式:降低亮度,开启常亮
Future<void> _enableReadingMode() async {
await Screen.setBrightness(0.7);
await Screen.keepOn(true);
}
// 游戏模式:提高亮度,开启常亮
Future<void> _enableGamingMode() async {
await Screen.setBrightness(1.0);
await Screen.keepOn(true);
}
// 夜间模式:降低亮度,不保持常亮
Future<void> _enableNightMode() async {
await Screen.setBrightness(0.3);
await Screen.keepOn(false);
}
5. 生命周期管理
void dispose() {
// 页面销毁时恢复默认设置
Screen.keepOn(false);
super.dispose();
}
🔧 故障排查
问题1:无法设置屏幕亮度
症状:调用 setBrightness() 后没有效果
可能原因:
- 应用在后台运行
- 设备不支持亮度调节
- 系统权限限制
解决方案:
// 1. 检查应用状态
if (WidgetsBinding.instance.lifecycleState != AppLifecycleState.resumed) {
return; // 应用在后台时可能无法设置
}
// 2. 添加错误处理
try {
await Screen.setBrightness(0.5);
} catch (e) {
print('设置亮度失败: $e');
}
问题2:保持常亮不生效
症状:设置 keepOn(true) 后屏幕仍然会休眠
可能原因:
- 应用进入后台
- 系统省电策略限制
- 设备不支持
解决方案:
// 1. 确保应用在前台
if (WidgetsBinding.instance.lifecycleState != AppLifecycleState.resumed) {
return;
}
// 2. 添加提示
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('请保持应用在前台运行')),
);
问题3:亮度设置不生效
症状:调用 setBrightness() 后亮度没有变化
可能原因:
- 设备不支持
- 系统亮度管理冲突
- 自动亮度功能冲突
解决方案:
// 提示用户关闭系统自动亮度
showDialog(
context: context,
builder: (context) => AlertDialog(
title: const Text('亮度设置失败'),
content: const Text('请先关闭系统自动亮度功能'),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('知道了'),
),
],
),
);
问题4:状态显示不正确
症状:显示的亮度或常亮状态与实际不符
可能原因:
- 未调用初始化方法
- 状态未正确更新
解决方案:
// 1. 确保在 initState 中调用初始化
void initState() {
super.initState();
_initScreenStatus();
}
// 2. 定期刷新状态
Timer.periodic(const Duration(seconds: 5), (timer) {
_initScreenStatus();
});
问题5:在模拟器上不工作
症状:在模拟器上测试时功能不正常
可能原因:
- 模拟器不支持某些功能
- 模拟器没有真实的屏幕
解决方案:
// 在真实设备上测试
if (Platform.isAndroid || Platform.isIOS) {
// 真实设备上测试
} else if (Platform.isLinux || Platform.isWindows) {
// 桌面应用可能不支持
showDialog(
context: context,
builder: (context) => AlertDialog(
title: const Text('提示'),
content: const Text('请在真实设备上测试此功能'),
actions: [
TextButton(
onPressed: () => Navigator.pop(context),
child: const Text('知道了'),
),
],
),
);
}
🔗 相关资源
更多推荐
所有评论(0)