相关文章推荐
Note:
It seems that you are trying to read this document in another language, but it is temporarily unavailable. This is usually because the service is not available in your country/region. You can read the document in the following languages to learn this service.
安卓应用卡片开发指南

前言

本文用于指导开发者如何在荣耀手机上开发应用微件,为了让用户获取最佳应用微件的体验,同时为了让荣耀向用户更好地推荐您的应用微件,您需要遵守本文第二章节所描述的技术规范。

遵循Google原生widget开发规范

请参考 构建应用微件 | Android 开发者 | Android Developers

在清单中添加应用微件meta-data信息

为了让我们识别您已经开发完成的应用微件,需要在应用的 AndroidManifest.xml文件中对针对您已声明的 AppWidgetProvider 类,新增meta-data信息com.hihonor.widget.type ,代码示例如下:

<receiver android:name="ExampleAppWidgetProvider" >
    <intent-filter>
        <action android:name="android.appwidget.action.APPWIDGET_UPDATE" />
    </intent-filter>
    <meta-data android:name="android.appwidget.provider"
               android:resource="@xml/example_appwidget_info" />
    <meta-data android:name="com.hihonor.widget.type"
               android:value="honorcard" />
</receiver>

对于上述代码示例中两组meta-data信息说明如下:

第一组meta-data信息为android原生配置,若需配置仅荣耀设备读取,其他厂商设备不读取卡片信息,可将“android.appwidget.provider”更换为"android.appwidget.honor.provider".

widget卡片是否配置

android.appwidget.honor.provider

荣耀MagicUI6.0及以上机型 荣耀MagicUI6.0以下机型 其他厂商机型

第二组meta-data信息,是为了让荣耀识别您已经开发完成的应用微件,并在荣耀快服务等新入口展示卡片。此配置不影响荣耀MagicUI6.0以下的旧版本手机、其他厂商机型手机上卡片的展示。

卡片中的本地图片设置圆角

在制作卡片时,在使用本地图片填充widget布局中的imageView时,当imageView拥有固定宽高时,示例代码如下(kotlin),仅供参考。

val remoteViews : RemoteViews = .....
val roundedBitmapDrawable = RoundedBitmapDrawableFactory.create(context.resources,
    BitmapFactory.decodeResource(context.resources, 本地图片资源ID)
roundedBitmapDrawable.isCircular = true
val bitmap = Bitmap.createBitmap(
    roundedBitmapDrawable.intrinsicWidth,
    roundedBitmapDrawable.intrinsicHeight, Bitmap.Config.ARGB_8888
val canvas = Canvas(bitmap)
roundedBitmapDrawable.setBounds(0, 0, canvas.width, canvas.height)
roundedBitmapDrawable.draw(canvas)
remoteViews.setImageViewBitmap(布局中的imageView资源ID,bitmap)

当imageView未设置固定宽高时,可采用给直角图片覆盖一个与背景同色且带有内圆角的边框的方式来裁切,若需参考样例可发送邮件至 [email protected] 获取。

当边框的宽度设置为xdp时,对应的imageView也需设置padding = “xdp”

荣耀卡片适配PAD及折叠屏

卡片适配基本原则:

均分:保证指定元素与元素之间的间距一致,去适应卡片容器的尺⼨变化;允许定义组件最左端和最右端是否一起均分/指定固定值,若不定义,默认一起参与均分;

左右结构:左侧距离左边固定或左侧水平居中,右侧距离右边固定或右侧水平居中,保证卡片拉伸后显示效果无误。

左右结构、均分:可以往水平/垂直方向拉伸,来适应卡片大小的变化

占比:定义了占比能力的组件,保证指定元素始终在卡片内的某一个比例空间中进行布局。⽔平方向或垂直方向有占比能力,也可均有

拉伸:在布局宽度变化的时候,列表会随宽度变化⽽体现拉伸能力

宫格样式:卡片在pad下,可显示更多的元素。例:手机竖屏,图片可展示3个,相同卡片pad上可展示4个;

缩放:沉浸式背景图可以往⽔平/垂直⽅向拉伸,来适应组件容器的变化,进行自适应撑满容器,不得出现图片拉伸比例等情况。图文列表的图片比例不变,文字根据宽度拉伸

按照荣耀公司卡片适配UX规范,卡片分为纯文本类、图文类、列表类、宫格类。

为了在PAD展示情况下有更好的用户体验效果,所有类型卡片建议至少要实现横向拉伸,宽度通过权重方式设置。

widget卡片点击跳转指定页面实现

卡片跳转指定页面通过PendingIntent实现,具体实现方式如下(kotlin):

val intent = Intent()
intent.setClass(context, Test::class.java)
intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK)
intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK)
val pi = PendingIntent.getActivity(context, requestCode, intent,
		PendingIntent.FLAG_IMMUTABLE)
remoteView.setOnClickPendingIntent(layoutId, pi)

深色模式适配

深色模式适配按照原生系统适配方式,在values和values-night分别配置通用模式和深色模式下使用的颜色,在drawable和drawable-night下分别配置通用模式和深色模式使用的资源文件。

卡片圆角处理

荣耀的widget卡片容器已做圆角处理,大小是16dp,卡片提供方外层四周圆角不用单独设置,卡片内部元素使用圆角还需自行设置。

折叠屏手机折叠和展开态卡片适配

在安卓S版本关于widget应用小部件新增了响应式布局方案,根据当前widget展示的大小,显示指定的样式具体实现如下(kotlin):

override fun onUpdate(context: Context?, appWidgetManager: AppWidgetManager?, appWidgetIds: IntArray) {
    for (appWidgetId in appWidgetIds) {
        val normalView = RemoteViews(context.packageName, R.layout.normal4*2)
        val unfoldViewForBoard = RemoteViews(context.packageName, R.layout.unfold4*2)
        val unfoldViewHorOneForLauncher = RemoteViews(context.packageName, R.layout.unfold4*2)
        val unfoldViewHorTwoForLauncher = RemoteViews(context.packageName, R.layout.unfold4*2)
        val unfoldViewVertForLauncher = RemoteViews(context.packageName, R.layout.unfold4*2)
        val viewMapping: Map<SizeF, RemoteViews?> = mapOf (
            SizeF(320f,152f) to normalView, //正常4*2样式
            SizeF(460f,142f) to unfoldViewForBoard, //负一屏展开4*2样式
            SizeF(561f,136f) to unfoldViewHorOneForLauncher, //桌面横屏展开4*2样式1
            SizeF(531f,136f) to unfoldViewHorTwoForLauncher, //桌面横屏展开4*2样式2
            SizeF(529f,164f) to unfoldViewForLauncher //桌面竖屏展开4*2样式
        val remoteViews = RemoteViews(viewMapping)
        AppWidgetManager.getInstance(context).updateAppWidget(appWidgetId, remoteViews)
}

为保证所有三方卡片的整体效果一致,建议文字统一使用dp为单位,来禁止文字字体跟随系统设置变化,例如:android:textSize="14dp"

荣耀快服务卡片支持即点即用,故不可使用Android widget原生回调接口做埋点处理逻辑。

(如:onEnable\onUpdate\onAppWidgetOptionsChanged\onDeleted\onDisabled\onReceive等)

荣耀提供卡片曝光、点击、添加与移除的统计数据,可联系数据运营人员进行导出。

Previous 设计指南
安卓应用卡片开发指南
Was this helpful to you?
Yes
No
埋点说明
In order to provide you with the best experience, HONOR Developers needs to collect your cookie information. Click here to read our Cookies Policy.
 
推荐文章