后浪云百度小程序教程:swan.setBackgroundColor

  • swan.setBackgroundColor
    • 方法参数
      • object 参数说明
    • 示例
      • 图片示例
      • 代码示例
    • 错误码
      • Android
      • iOS

    swan.setBackgroundColor

    基础库 3.10.4 版本开始支持。

    解释:设置窗口的背景颜色。顶部或底部窗口颜色设置,建议与页面背景色保持一致,避免下拉或上拉页面时颜色不协调。

    方法参数

    Object object

    object 参数说明

    属性名 类型 必填 默认值 说明

    backgroundColor

    String

    需设置的背景窗口颜色,支持十六进制颜色值。11.3
    低版本请做兼容性处理

    backgroundColorTop

    String

    -

    需设置的顶部背景窗口颜色,支持十六进制颜色值,仅 iOS 有效。 11.3
    低版本请做兼容性处理

    backgroundColorBottom

    String

    -

    需设置的底部背景窗口颜色,支持十六进制颜色值,仅 iOS 有效。11.3
    低版本请做兼容性处理

    success

    Function

    接口调用成功的回调函数

    fail

    Function

    接口调用失败的回调函数

    complete

    Function

    接口调用结束的回调函数(调用成功、失败都会执行)

    示例

    在开发者工具中打开

    在开发者工具中打开

    在 WEB IDE 中打开

    扫码体验

    代码示例

    后浪云百度小程序教程:swan.setBackgroundColor插图

    请使用百度APP扫码

    图片示例

    iOS 端预览

    后浪云百度小程序教程:swan.setBackgroundColor插图1

    安卓端预览

    后浪云百度小程序教程:swan.setBackgroundColor插图2

    代码示例

    • SWAN
    • JS
     
     
     
    1. <view class="wrap">
    2. <view class="card-area">
    3. <view class="top-description border-bottom">
    4. <view>设置窗口背景色</view>
    5. <view>backgroundColor</view>
    6. </view>
    7. <button bind:tap="setBackgroundColor" type="primary" hover-stop-propagation="true">设置窗口颜色为蓝色</button>
    8. </view>
    9. <view class="card-area" s-if="{{!isWeb}}">
    10. <view class="top-description border-bottom">
    11. <view>设置顶部窗口的背景颜色</view>
    12. <view>backgroundColorTop</view>
    13. </view>
    14. <button bind:tap="setBackgroundColorTop" type="primary" hover-stop-propagation="true">设置顶部窗口颜色为浅蓝</button>
    15. <view class="tip-week">注:下拉页面查看效果</view>
    16. </view>
    17. <view class="card-area" s-if="{{!isWeb}}">
    18. <view class="top-description border-bottom">
    19. <view>设置底部窗口的背景颜色</view>
    20. <view>backgroundColorBottom</view>
    21. </view>
    22. <button bind:tap="setBackgroundColorBottom" type="primary" hover-stop-propagation="true">设置底部窗口颜色为浅蓝</button>
    23. <view class="tip-week">注:上拉页面查看效果</view>
    24. </view>
    25. </view>

    错误码

    Android

    错误码 说明

    202

    解析失败,请检查参数是否正确

    1001

    执行失败

    iOS

    错误码 说明

    202

    解析失败,请检查参数是否正确

    THE END