Flutter动态图标管理插件ann_dynamic_icon的使用

dynamically changing app launcher icon

开始使用

此项目是一个用于Flutter的插件包起点，它是一个专门的包，包含针对Android和/或iOS的平台特定实现代码。

有关开始Flutter开发的帮助，请查看在线文档，其中包含教程、示例、移动开发指南和完整的API参考。

示例代码

以下是一个完整的示例代码，展示如何使用ann_dynamic_icon插件来动态更改应用程序的启动图标。

示例代码

// 引入必要的库
import 'package:flutter/material.dart';
import 'dart:async';

import 'package:flutter/services.dart'; // 提供与原生代码交互的功能
import 'package:ann_dynamic_icon/ann_dynamic_icon.dart'; // 动态图标管理插件

void main() {
  runApp(const MyApp()); // 启动应用
}

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key); // 构造函数

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState(); // 创建状态对象
}

class _MyAppState extends State<MyApp> {
  String _platformVersion = 'Unknown'; // 平台版本变量
  final _annDynamicIconPlugin = AnnDynamicIcon(); // 动态图标插件实例

  [@override](/user/override)
  void initState() {
    super.initState();
    initPlatformState(); // 初始化平台状态
  }

  // 异步初始化平台状态
  Future<void> initPlatformState() async {
    String platformVersion;
    try {
      // 获取平台版本信息
      platformVersion =
          await _annDynamicIconPlugin.getPlatformVersion() ?? 'Unknown platform version';
    } on PlatformException {
      // 捕获异常
      platformVersion = 'Failed to get platform version.';
    }

    // 如果组件已从树中移除，则不更新UI
    if (!mounted) return;

    // 更新UI
    setState(() {
      _platformVersion = platformVersion;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('动态图标示例'), // 设置标题
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center, // 居中对齐
            children: [
              Text('运行在: $_platformVersion\n'), // 显示平台版本
              ElevatedButton( // 添加按钮用于切换图标
                onPressed: () async {
                  try {
                    // 调用插件方法切换图标
                    await _annDynamicIconPlugin.setDynamicIcon('icon_name');
                    print('图标已切换');
                  } on PlatformException catch (e) {
                    print('切换失败: ${e.message}');
                  }
                },
                child: Text('切换图标'), // 按钮文本
              ),
            ],
          ),
        ),
      ),
    );
  }
}

更多关于Flutter动态图标管理插件ann_dynamic_icon的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter动态图标管理插件ann_dynamic_icon的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


ann_dynamic_icon 是一个用于 Flutter 应用的插件，它允许开发者在运行时动态更改应用的启动图标。这在某些场景下非常有用，例如在特定节日或活动期间更改应用图标，或者根据用户偏好提供不同的图标选择。

安装插件

首先，你需要在 pubspec.yaml 文件中添加 ann_dynamic_icon 插件的依赖：

dependencies:
  ann_dynamic_icon: ^1.0.0

然后运行 flutter pub get 来安装插件。

配置 Android 和 iOS

Android

在 android/app/src/main/AndroidManifest.xml 文件中，确保你为每个备用图标定义了 <activity-alias>。例如：

<application
    android:name="io.flutter.app.FlutterApplication"
    android:label="MyApp"
    android:icon="@mipmap/ic_launcher">
    <activity
        android:name=".MainActivity"
        android:launchMode="singleTop"
        android:theme="@style/LaunchTheme"
        android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|screenLayout|density|uiMode"
        android:hardwareAccelerated="true"
        android:windowSoftInputMode="adjustResize">
        <meta-data
            android:name="io.flutter.embedding.android.NormalTheme"
            android:resource="@style/NormalTheme"
            />
        <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
        </intent-filter>
    </activity>

    <!-- 定义备用图标 -->
    <activity-alias
        android:name=".MainActivityAlias1"
        android:targetActivity=".MainActivity"
        android:icon="@mipmap/ic_launcher_alternate1"
        android:enabled="false">
        <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
        </intent-filter>
    </activity-alias>

    <activity-alias
        android:name=".MainActivityAlias2"
        android:targetActivity=".MainActivity"
        android:icon="@mipmap/ic_launcher_alternate2"
        android:enabled="false">
        <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
        </intent-filter>
    </activity-alias>
</application>

iOS

在 ios/Runner/Info.plist 文件中，添加备用图标的配置：

<key>CFBundleIcons</key>
<dict>
    <key>CFBundleAlternateIcons</key>
    <dict>
        <key>AlternateIcon1</key>
        <dict>
            <key>CFBundleIconFiles</key>
            <array>
                <string>AlternateIcon1</string>
            </array>
            <key>UIPrerenderedIcon</key>
            <false/>
        </dict>
        <key>AlternateIcon2</key>
        <dict>
            <key>CFBundleIconFiles</key>
            <array>
                <string>AlternateIcon2</string>
            </array>
            <key>UIPrerenderedIcon</key>
            <false/>
        </dict>
    </dict>
</dict>

使用插件

在你的 Flutter 代码中，你可以使用 ann_dynamic_icon 插件来动态更改应用图标。以下是一个简单的示例：

import 'package:flutter/material.dart';
import 'package:ann_dynamic_icon/ann_dynamic_icon.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: IconChangerScreen(),
    );
  }
}

class IconChangerScreen extends StatefulWidget {
  [@override](/user/override)
  _IconChangerScreenState createState() => _IconChangerScreenState();
}

class _IconChangerScreenState extends State<IconChangerScreen> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dynamic Icon Example'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            ElevatedButton(
              onPressed: () async {
                await AnnDynamicIcon.setAlternateIconName('AlternateIcon1');
                print('Icon changed to AlternateIcon1');
              },
              child: Text('Change to Icon 1'),
            ),
            ElevatedButton(
              onPressed: () async {
                await AnnDynamicIcon.setAlternateIconName('AlternateIcon2');
                print('Icon changed to AlternateIcon2');
              },
              child: Text('Change to Icon 2'),
            ),
            ElevatedButton(
              onPressed: () async {
                await AnnDynamicIcon.setAlternateIconName(null);
                print('Icon changed to default');
              },
              child: Text('Reset to Default Icon'),
            ),
          ],
        ),
      ),
    );
  }
}
回到顶部