You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在Xamarin的FCM推送通知中同时显示BigPicture与多行文本

实现同时展示展开式图片和多行文本的推送通知

嘿,这个需求其实挺常见的!Android官方的NotificationCompat.Style确实不支持直接叠加BigPictureStyle和BigTextStyle,但我们有两个实用的办法来实现同时展示大图和多行文本的效果,我给你详细说说:

方法一:利用BigPictureStyle自带的文本能力(最简单)

你可能不知道,BigPictureStyle本身就支持添加多行文本!它的bigText()方法就是用来设置展开后的详细多行内容的,配合bigPicture()设置大图,就能完美实现你要的效果。

示例代码(Kotlin):

val notificationBuilder = NotificationCompat.Builder(context, YOUR_CHANNEL_ID)
    .setSmallIcon(R.drawable.ic_notification_small) // 必须设置小图标
    .setContentTitle("周末露营活动提醒") // 折叠状态显示的标题
    .setContentText("点击查看活动详情") // 折叠状态的简短文本
    .setStyle(NotificationCompat.BigPictureStyle()
        .bigPicture(BitmapFactory.decodeResource(resources, R.drawable.camping_banner)) // 设置展开后的大图
        .bigText("本次露营活动将于本周六上午9点在森林公园集合\n请携带帐篷、防潮垫和充足的饮用水\n活动全程约8小时,记得穿舒适的户外鞋哦") // 多行文本,支持换行
        .setSummaryText("主办方:户外爱好者协会")) // 可选:底部的摘要文本
// 发送通知
NotificationManagerCompat.from(context).notify(NOTIFICATION_ID, notificationBuilder.build())

展开后的通知会先显示你设置的大图,紧接着就是多行的详细文本,折叠状态下则显示你设置的简短内容,完全满足需求。

方法二:自定义RemoteViews(更灵活)

如果你的布局需求更特殊(比如文本要放在大图上方,或者需要自定义字体、间距等),可以用自定义RemoteViews来实现完全自定义的展开式通知布局。

步骤1:创建自定义布局文件

在res/layout下新建custom_big_notification.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="16dp">

    <ImageView
        android:id="@+id/notification_big_image"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:scaleType="centerCrop"/>

    <TextView
        android:id="@+id/notification_big_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="12dp"
        android:textSize="16sp"
        android:maxLines="0"/> <!-- maxLines=0 支持自动换行显示所有内容 -->
</LinearLayout>

步骤2:在代码中设置自定义视图

// 初始化自定义RemoteViews
val customBigView = RemoteViews(context.packageName, R.layout.custom_big_notification)
// 设置大图
customBigView.setImageViewResource(R.id.notification_big_image, R.drawable.camping_banner)
// 设置多行文本
customBigView.setTextViewText(R.id.notification_big_text, "本次露营活动将于本周六上午9点在森林公园集合\n请携带帐篷、防潮垫和充足的饮用水\n活动全程约8小时,记得穿舒适的户外鞋哦")

val notificationBuilder = NotificationCompat.Builder(context, YOUR_CHANNEL_ID)
    .setSmallIcon(R.drawable.ic_notification_small)
    .setContentTitle("周末露营活动提醒")
    .setContentText("点击查看活动详情")
    .setCustomBigContentView(customBigView) // 设置展开后的自定义视图

// 发送通知
NotificationManagerCompat.from(context).notify(NOTIFICATION_ID, notificationBuilder.build())

这种方法能完全控制通知的布局样式,适合有特殊UI需求的场景。


内容的提问来源于stack exchange,提问作者Mili

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.21 08:12:01