57、Android开发：内购、主题设计与动态颜色实现

Android开发：内购、主题设计与动态颜色实现

1. Android内购教程

1.1 内购逻辑处理

当传递给监听器的购买列表不为空时，列表中的第一个购买项会被分配给 purchase 变量，并且“消耗购买”按钮会被启用。在更完善的实现中，应该添加代码，通过比较产品ID来检查这是否是正确的产品，并处理多个购买项的返回情况。如果未找到购买项，“消耗购买”按钮将被禁用，直到进行下一次购买。在计费设置过程中，需要调用新的 reloadPurchase() 方法，代码如下：

private void billingSetup() {
    // ...
    if (billingResult.getResponseCode() == BillingClient.BillingResponseCode.OK) {
        Log.i(TAG, "OnBillingSetupFinish connected");
        queryProduct();
        reloadPurchase();
    } else {
        Log.i(TAG, "OnBillingSetupFinish failed");
    }
    // ...
}

1.2 应用测试

在测试应用之前，需要将最新版本上传到Play Console。由于已经上传了版本1，需要在 build.gradle.kts （模块：app）文件中增加版本号：

defaultConfig {
    applicationId "com.ebookfrenzy.inapppurchase"
    minSdk 26
    targetSdk 32
    versionCode 2
    versionName "2.0"
    // ...
}

同步构建配置，然后按照“创建、测试和上传Android应用捆绑包”的步骤生成新的应用捆绑包，将其上传到内部测试轨道，并推送给测试人员。具体操作步骤如下：
1. 同步构建配置。
2. 生成新的应用捆绑包。
3. 上传到内部测试轨道。
4. 推送给测试人员。

使用内部测试链接，在已登录测试账户的设备或模拟器上安装应用。定位测试链接的方法是：在Google Play Console中选择应用，从导航面板中选择“内部测试”选项，然后选择“测试人员”标签，滚动到屏幕的“How testers join your test”部分，点击“复制链接”。在测试设备或模拟器上打开Chrome浏览器，输入测试链接，按照说明从Play商店安装应用。应用启动后，短暂延迟后应在 TextView 上显示产品名称。点击“购买”按钮将开始购买流程。

1.3 故障排除

如果在购买过程中遇到问题，可以按照以下步骤进行排查：
1. 确保设备通过USB电缆或WiFi连接到Android Studio，并在Logcat面板中选择该设备。
2. 在Logcat搜索栏中输入 InAppPurchaseTag ，检查诊断输出，必要时在代码中添加额外的 Log 调用。
3. 对于失败的额外信息，可以从 BillingResult 实例中获取调试消息，示例代码如下：

} else if (billingResult.getResponseCode() == BillingClient.BillingResponseCode.USER_CANCELED) {
    Log.i(TAG, "onPurchasesUpdated: Purchase Canceled");
} else {
    Log.i(TAG, billingResult.getDebugMessage());
}

如果测试支付卡未列出，确保设备用户账户已添加到许可证测试人员列表中。如果应用在物理设备上运行，可以尝试在模拟器上运行。如果所有方法都失败，可以输入有效的支付方式进行测试购买，然后使用Play Console主页上的“订单管理”屏幕进行退款。

1.4 内购流程总结

步骤	操作
1	处理购买列表，启用或禁用“消耗购买”按钮
2	增加应用版本号并上传到Play Console
3	获取测试链接，安装应用并进行购买测试
4	遇到问题时进行故障排除

1.5 内购流程mermaid流程图

graph LR
    A[开始计费设置] --> B{计费设置成功?}
    B -- 是 --> C[查询产品]
    B -- 否 --> D[记录失败日志]
    C --> E[重新加载购买信息]
    E --> F{有购买记录?}
    F -- 是 --> G[分配购买项，启用消耗按钮]
    F -- 否 --> H[禁用消耗按钮]
    G --> I[进行购买测试]
    I --> J{购买成功?}
    J -- 是 --> K[消耗购买项]
    J -- 否 --> L[故障排除]

2. Material Design 3主题设计

2.1 Material Design概述

Android应用的外观旨在符合Material Design定义的一组指南。Google开发Material Design是为了在不同应用之间提供一定程度的设计一致性，同时允许应用开发者在颜色、排版和形状选择方面加入自己的品牌元素（这一概念称为Material主题化）。除了设计指南，Material Design还包括一组用于设计用户界面布局的UI组件。

2.2 Material Design 2与Material Design 3对比

Google正在从Material Design 2过渡到Material Design 3，Android Studio Giraffe项目默认使用Material Design 3。Material Design 3为Material You提供了基础，这是Android 12中引入的一项功能，允许应用自动调整主题元素，以补充用户在设备上配置的偏好。例如，Material Design 3提供的动态颜色支持，允许应用中使用的颜色自动适应以匹配用户的壁纸选择。

2.3 理解Material Design主题化

Android应用的用户界面是通过组装布局、文本字段和按钮等组件创建的。除非在XML布局资源文件中专门覆盖颜色属性或通过代码进行设置，否则这些组件将使用默认颜色显示。项目的主题定义了这些默认颜色。主题由一组颜色插槽（在 themes.xml 文件中声明）组成，这些插槽被分配颜色值（在 colors.xml 文件中声明）。每个UI组件在内部被编程为使用主题颜色插槽作为特定属性的默认颜色（例如， Text 小部件的前景色和背景色）。因此，通过更改分配给特定主题插槽的颜色，可以更改应用的全局主题。当应用运行时，新的默认颜色将在渲染用户界面时应用于所有小部件。

2.4 Material Design 3主题使用

应用项目使用的主题在 AndroidManifest.xml 文件中作为应用元素的属性声明，示例如下：

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <application
        android:supportsRtl="true"
        android:theme="@style/Theme.MyDemoApp"
        tools:targetApi="31">
        <!-- ... -->
    </application>
</manifest>

与项目主题相关的所有文件都包含在 res -> values 文件夹中的 colors.xml 和 themes.xml 文件中。主题本身在 themes 文件夹中的两个 themes.xml 文件中声明，这些资源文件声明了不同的调色板，包含在设备处于浅色或深色（夜间）模式时使用的Material主题颜色插槽。注意，每个文件中的样式名称属性必须与 AndroidManifest.xml 文件中引用的名称匹配，示例如下：

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Base.Theme.MyDemoApp" parent="Theme.Material3.DayNight.NoActionBar">
        <!-- Customize your light theme here. -->
        <!-- <item name="colorPrimary">@color/my_light_primary</item> -->
    </style>
    <style name="Theme.MyDemoApp" parent="Base.Theme.MyDemoApp" />
</resources>

这些颜色插槽（也称为颜色属性）被Material组件用于在屏幕上渲染时设置颜色。例如， colorPrimary 颜色插槽被用作Material按钮组件的背景颜色。MD3中的颜色插槽分为主要、次要、第三、错误、背景和表面等组，这些插槽进一步分为基色和“在基色上”的颜色对，通常对应于Material组件的背景色和前景色。不同的小部件会使用不同的颜色组，例如，Material按钮小部件会使用 colorPrimary 基色作为背景色，使用 colorOnPrimary 作为其内容（即显示的文本或图标）的颜色；而 FloatingActionButton 组件则使用 colorPrimaryContainer 作为背景色，使用 colorOnPrimaryContainer 作为前景色。可以通过更改主题文件中的颜色设置，并在布局编辑器中查看渲染效果，快速确定特定小部件类型应使用的正确颜色组。

2.5 创建自定义主题

如果需要将 colorPrimary 更改为红色，可以在 colors.xml 文件中添加一个新的红色条目，然后在 themes.xml 文件中将其分配给 colorPrimary 插槽。示例如下：
themes.xml 文件：

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Base.Theme.MyDemoApp" parent="Theme.Material3.DayNight.NoActionBar">
        <item name="colorPrimary">@color/my_bright_primary</item>
    </style>
    <style name="Theme.MyDemoApp" parent="Base.Theme.MyDemoApp" />
</resources>

colors.xml 文件：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- ... -->
    <color name="my_bright_primary">#FC0505</color>
</resources>

为了更方便地设计自定义颜色主题，Google开发了Material Theme Builder工具，可通过以下链接访问： https://m3.material.io/theme-builder#/custom 。在自定义屏幕上，通过点击颜色圆圈显示颜色选择对话框，为主要颜色键选择一种颜色。选择颜色后，预览区域将显示所有MD3颜色插槽的推荐颜色，以及示例应用界面和小部件。此外，可以通过点击相应的颜色圆圈显示颜色选择对话框，覆盖为次要、第三和中性插槽生成的颜色。点击“导出”按钮并选择“Android View (XML)”选项，下载生成的 colors.xml 和 themes.xml 文件，用于替换项目中的现有文件。注意，导出的两个 themes.xml 文件中的主题名称必须更改，以匹配项目。

2.6 主题设计步骤总结

步骤	操作
1	了解Material Design 2与3的区别
2	理解主题化原理，找到相关主题文件
3	根据需求修改颜色插槽
4	使用Material Theme Builder创建自定义主题
5	导出并替换项目中的主题文件

2.7 主题设计流程mermaid流程图

graph LR
    A[开始主题设计] --> B{选择Material Design版本}
    B -- Material Design 3 --> C[理解主题化原理]
    C --> D[定位主题文件]
    D --> E{需要自定义主题?}
    E -- 是 --> F[使用Material Theme Builder]
    E -- 否 --> G[使用默认主题]
    F --> H[选择主要颜色]
    H --> I[调整其他颜色]
    I --> J[导出主题文件]
    J --> K[替换项目中的文件]
    G --> L[应用默认主题]
    K --> M[完成主题设计]
    L --> M

3. Material Design 3主题与动态颜色教程

3.1 创建ThemeDemo项目

首先，从欢迎屏幕中选择“New Project”选项，在弹出的新项目对话框中，选择“Empty Views Activity”模板，然后点击“Next”按钮。在“Name”字段中输入“ThemeDemo”，并指定“com.ebookfrenzy.themedemo”作为包名。在点击“Finish”按钮之前，将“Minimum API level”设置为“API 26: Android 8.0 (Oreo)”，并将“Language”菜单选择为“Java”。

3.2 设计用户界面

主活动将包含一个简单的布局，其中包含一些用户界面组件，以便我们可以看到后续主题设计工作的效果。对于MD3组件的信息，可以参考 https://material.io/blog/migrating-material-3 。
设计布局的步骤如下：
1. 打开 activity_main.xml 文件，该文件目前包含一个单一的 Text 视图。
2. 删除 Text 视图。
3. 关闭自动连接模式（在图85 - 1中标记为A）。
4. 点击按钮清除布局中的所有约束（标记为B）。
5. 从调色板的“Buttons”部分，将 Chip 、 CheckBox 、 Switch 和 Button 视图拖到布局画布上。
6. 将 FloatingActionButton 拖到布局画布上，将其定位在 Button 组件下方。当提示选择要显示在 FloatingActionButton 上的图标时，从资源工具窗口中选择 ic_lock_power_off 图标。
7. 将 Chip 小部件的文本属性更改为“This is my chip”，并将 chipIcon 属性设置为 @android:drawable/ic_btn_speak_now ，使布局类似于图85 - 3左侧所示。
8. 为了设置约束，选择所有组件，右键单击 Chip 视图，从弹出菜单中选择“Chains -> Create Vertical Chain”。再次重复此步骤，这次选择“Center -> Horizontally in Parent”菜单选项。
9. 编译并运行应用，验证用户界面是否与图85 - 3中的显示一致。

3.3 构建新主题

要构建新主题，可以按照以下步骤操作：
1. 打开浏览器窗口，导航到 https://m3.material.io/theme-builder#/custom 以访问构建工具。
2. 加载构建工具后，选择一个壁纸，然后点击屏幕顶部的“Custom”按钮。
3. 点击“Core Colors”部分中的主要颜色圆圈，显示颜色选择对话框，选择任何颜色作为主题的基础。
4. 在“Your Theme”面板中查看配色方案，并使用“Core colors”设置进行必要的颜色调整，直到对所有MD3颜色插槽的颜色满意为止。
5. 主题准备好后，点击右上角的“Export”按钮，选择“Android Views (XML)”选项。
6. 提示保存文件时，将其保存到计算机文件系统的合适位置。主题将保存为名为“material - theme.zip”的压缩文件。
7. 使用适合操作系统的工具解压缩主题文件，该文件应包含以下文件夹和文件：
- values/colors.xml ：颜色定义。
- values/themes.xml ：浅色模式的主题。
- values - night/themes.xml ：深色模式的主题。

3.4 将主题添加到项目

在将新主题添加到项目之前，需要先删除旧的主题文件。操作步骤如下：
1. 确保项目工具窗口处于“Project Files”模式。可以使用项目工具窗口顶部的菜单进行切换，选择“Project Files”选项。
2. 导航到 app -> src -> main -> res -> values 文件夹，选择并删除 colors.xml 和 themes.xml 文件。
3. 删除 values - night 文件夹中的 themes.xml 文件。
4. 打开操作系统的文件系统导航工具，找到新 material theme 的 values 文件夹中的 colors.xml 和 themes.xml 文件，将它们复制并粘贴到项目工具窗口的 values 文件夹中。
5. 重复上述步骤，将 values - night 文件夹中的 themes.xml 文件复制并粘贴到项目的 values - night 文件夹中。
6. 将项目工具窗口切换回“Android”模式，此时值资源文件部分应与图85 - 6匹配。
7. 修改浅色 themes.xml 文件，使其与当前项目匹配，示例如下：

<resources>
    <style name="Base.Theme.ThemeDemo" parent="Theme.Material3.Light.NoActionBar">
        <item name="colorPrimary">@color/md_theme_light_primary</item>
        <item name="colorOnPrimary">@color/md_theme_light_onPrimary</item>
        <!-- ... -->
    </style>
    <style name="Theme.ThemeDemo" parent="Base.Theme.ThemeDemo" />
</resources>

8. 对 themes.xml （夜间）文件重复上述步骤进行相同的修改。
9. 返回 activity_main.xml 文件或重新运行应用，确认用户界面是否使用自定义主题颜色进行渲染。

3.5 启用动态颜色支持

要测试动态颜色，应用需要在运行Android 12或更高版本的设备或模拟器上运行，并且需要正确设置壁纸。操作步骤如下：
1. 在设备或模拟器上启动“Settings”应用，从选项列表中选择“Wallpaper & style”。
2. 在壁纸设置屏幕上，点击更改壁纸的选项（在图85 - 7中标记为A），选择一个包含与主题颜色显著不同颜色的壁纸图像。选择后，将壁纸分配给主屏幕。
3. 返回“Wallpaper & styles”屏幕，确保选择了“Wallpaper colors”选项（标记为B），然后从配色方案按钮中选择一个选项（标记为C）。每次点击一个选项时，壁纸示例将相应更改以反映选择。
4. 要启用动态颜色，需要调用 DynamicColors 类的 applyToActivitiesIfAvailable() 方法。为了为整个应用启用动态颜色支持，需要在自定义 Application 实例的 onCreate() 方法中调用此方法。首先，在项目的 app -> java -> com.ebookfrenzy.themedemo 下添加一个新的Java类文件，命名为 ThemeDemoApplication.java ，并将其修改如下：

package com.ebookfrenzy.themedemo;

import android.app.Application;
import androidx.core.graphics.drawable.DrawableCompat;
import com.google.android.material.color.DynamicColors;

public class ThemeDemoApplication extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        DynamicColors.applyToActivitiesIfAvailable(this);
    }
}

3.6 主题与动态颜色教程步骤总结

步骤	操作
1	创建ThemeDemo项目
2	设计用户界面，设置布局和约束
3	使用Material Theme Builder构建新主题
4	将新主题文件添加到项目中并修改
5	在设备上设置壁纸并启用动态颜色支持

3.7 主题与动态颜色教程mermaid流程图

graph LR
    A[创建ThemeDemo项目] --> B[设计用户界面]
    B --> C[构建新主题]
    C --> D[添加主题到项目]
    D --> E[修改主题文件]
    E --> F[设置设备壁纸]
    F --> G[启用动态颜色支持]
    G --> H[完成主题与动态颜色设置]

4. 总结

Android内购功能为应用提供了盈利的途径，通过处理购买列表、上传应用到Play Console、进行测试和故障排除等步骤，可以确保内购流程的顺利进行。Material Design 3主题设计则为应用带来了更丰富的视觉效果和用户体验，通过理解主题化原理、使用Material Theme Builder创建自定义主题以及启用动态颜色支持，可以让应用更具个性化和吸引力。开发者可以根据这些技术，打造出功能强大且美观的Android应用。