简体   繁体   English

更改 flutter 应用程序图标的背景颜色

[英]Change background color of flutter app icon

I want to change background icon to #fe6017 .我想将背景图标更改为#fe6017 I use flutter_launcher_icons , set adaptive_icon_background: "#fe6017" .我使用flutter_launcher_icons ,设置adaptive_icon_background: "#fe6017" But it doesn't work.但它不起作用。 I also try to resize image.我也尝试调整图像大小。 But it always shrinks and put white color around my image.但它总是缩小并在我的图像周围放置white Thank you.谢谢你。

在此处输入图像描述

  1. Open android folder in Android Studio.在 Android Studio 中打开android文件夹。

  2. Right-click the res folder and select New > Image Asset.右键单击 res 文件夹和 select New > Image Asset。

  3. In the Icon Type field, select Launcher Icons (Adaptive & Legacy).在图标类型字段中,select 启动器图标(自适应和旧版)。

  4. In the Foreground Layer tab, select an Asset Type, and then specify the asset in the field underneath:在前景层选项卡中,select 是资产类型,然后在下面的字段中指定资产:

  • Select Image to specify the path for an image file. Select Image 指定图像文件的路径。 * Select Clip Art to specify an image from the material design icon set. * Select 剪贴画从材料设计图标集中指定图像。 * Select Text to specify a text string and select a font. * Select Text 指定一个文本字符串和 select 一个字体。
  1. In the Background Layer tab, select an Asset Type, and then specify the asset in the field underneath.在背景层选项卡中,select 为资产类型,然后在下方字段中指定资产。 You can either select a color or specify an image to use as the background layer.您可以 select 一种颜色或指定一个图像用作背景层。
  2. In the Legacy tab, review the default settings and confirm you want to generate legacy, round, and Google Play Store icons.在旧版选项卡中,查看默认设置并确认您要生成旧版、圆形和 Google Play 商店图标。
  3. Optionally change the name and display settings for each of the Foreground Layer and Background Layer tabs: (可选)更改每个前景层和背景层选项卡的名称和显示设置:
  • Name - If you don't want to use the default name, type a new name.名称 - 如果您不想使用默认名称,请键入一个新名称。 If that resource name already exists in the project, as indicated by an error at the bottom of the wizard, it's overwritten.如果该资源名称已存在于项目中(如向导底部的错误所示),则会被覆盖。 The name can contain lowercase characters, underscores, and digits only.名称只能包含小写字符、下划线和数字。

  • Trim - To adjust the margin between the icon graphic and border in the source asset, select Yes.修剪 - 调整源资产中图标图形和边框之间的边距,select 是。 This operation removes transparent space, while preserving the aspect ratio.此操作删除透明空间,同时保留纵横比。 To leave the source asset unchanged, select No.要保持源资产不变,select No.

  • Color - To change the color for a Clip Art or Text icon, click the field.颜色 - 要更改剪贴画或文本图标的颜色,请单击该字段。 In the Select Color dialog, specify a color and then click Choose.在 Select 颜色对话框中,指定颜色,然后单击选择。 The new value appears in the field.新值出现在该字段中。

  • Resize - Use the slider to specify a scaling factor in percent to resize an Image, Clip Art, or Text icon.调整大小 - 使用 slider 指定比例因子以调整图像、剪贴画或文本图标的大小。 This control is disabled for the background layer when you specify a Color asset type.当您指定颜色资源类型时,此控件对背景层禁用。 Click Next.点击下一步。

  1. Optionally, change the resource directory: Select the resource source set where you want to add the image asset: src/main/res, src/debug/res, src/release/res, or a custom source set. (可选)更改资源目录:Select 要在其中添加图像资产的资源源集:src/main/res、src/debug/res、src/release/res 或自定义源集。 The main source set applies to all build variants, including debug and release.主要源集适用于所有构建变体,包括调试和发布。 The debug and release source sets override the main source set and apply to one version of a build.调试和发布源集覆盖主要源集并应用于一个版本的构建。 The debug source set is for debugging only.调试源集仅用于调试。 To define a new source set, select File > Project Structure > app > Build Types.要定义一个新的源集,select File > Project Structure > app > Build Types。 For example, you can define a beta source set and create a version of an icon that includes the text "BETA" in the bottom right corner.例如,您可以定义一个 beta 源集并创建一个图标版本,该版本在右下角包含文本“BETA”。 For more information, see Configure Build Variants.有关详细信息,请参阅配置构建变体。 Click Finish.单击完成。 Image Asset Studio adds the images to the mipmap folders for the different densities. Image Asset Studio 将图像添加到不同密度的 mipmap 文件夹中。

You can create an image filled with color #fe6017 and use it for adaptive_icon_background as in example您可以创建一个填充有颜色#fe6017 的图像并将其用于adaptive_icon_background,如示例

flutter_icons:
  android: "launcher_icon"
  ios: false
  image_path: "assets/icon/icon.png"
  adaptive_icon_background: "assets/icon/icon-background.png"
  adaptive_icon_foreground: "assets/icon/icon.png"

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM