[deviceone开发]-do_Webview的基本示例

最新推荐文章于 2018-01-08 15:32:38 发布

原创最新推荐文章于 2018-01-08 15:32:38 发布 · 240 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

一、简介

这个示例是webview的基础demo，加载了本地html文件，一个html做的登录的表单。这个示例也展示了webview里加载的html里的js代码怎么调用deviceone的SM，MM和UI组件。适合所有开发者
二、效果图

三、相关下载

https://github.com/do-project/code4do/tree/master/webview_demo
四、相关讨论

http://bbs.deviceone.net/forum.php?mod=viewthread&tid=583
五、更多案例
http://source.deviceone.net/
六、关于DeviceOne
http://www.deviceone.net/

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

only_do

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

精选资源

cordova-plugin-ionic-webview:用于Cordova的Web View插件，专门用于Ionic应用程序

05-04

该插件在iOS上使用WKWebView，在Android上使用最新的常绿webview。此外，此插件使Web开发人员期望使用HTML5样式路由轻松构建单页应用程序。注意：此存储库及其文档适用于cordova-plugin-ionic-webview @ 5.x ，...

精选资源

com.google.android.webview_95.0.4638.74-463807403_minAPI21

03-14

适用于安卓5,armv8a和armv7a

参与评论您还未登录，请先登录后发表或查看评论

[deviceone开发]-do_Webview加载JQueryMobile的示例

only_do的博客

12-14

142

一、简介 JQueryMobile是JQuery的移动版，不过它并没有像JQuery那么成功。我们只是使用JQueryMobile来展示do_Webview加载第三方js框架。适合所有开发者。二、效果图三、相关下载 http://pan.baidu.com/s/1dDtvud7四、相关讨论 http://bbs.deviceone.net/forum.php?mod=viewthrea...

app开发之deviceone

chunyouhai5703的博客

11-08

329

deviceone，跨平台、低成本、纯原生的app开发服务，具体介绍见：http://www.deviceone.net/ do不同于dcloud、rn等开发套件，do只是一座桥梁，可以选择使用javascript or lua进行纯原生开发，开发后的app同时适配android、ios、w...

deviceOne 开发日记(一)

zj_1992的博客

05-31

658

组件从学习到完成一个APP，整个过程中接触最多是应该是组件。组件主要分三部分：1.视图（UI）2.单例（SM）3.多例（MM）现在讲的是组件UI–视图。其中UI分三类：布局、容器、视图。组件长下面这样：开发过程中主要是通过这三类UI组件展示界面，其主要的功能就是界面组件的展示。开发的过程中主要是通过退拽的方式体现。界面UI不需要涉及到代码量。拖拽到相应的位置后通过

[DeviceOne开发]-do_LinearLayout组件使用技巧

weixin_30628801的博客

09-07

一、摘要今天跟大家主要来介绍一下DeviceOne中的do_linearlayout这个布局，在DeviceOne开发中，do_linearlayout这个布局是相当重要。现在给大家来总结一下。二、基本的总结我们来看下这个linearlayout，做过原生开发的同学（android或者ios或者windows）可能对这个单词比较熟悉，没错，这个linearlayout在Dev...

精选资源

android-system-webview-7703.apk

11-30

Android8.0以下手机自带的android-system-webview版本过低使用

crosswalk-webview-23.53.589.4-x86_64.zip

03-11

- 文件“crosswalk-webview-23.53.589.4-x86_64”是针对x86_64架构的版本，适用于64位设备。开发者在不同设备上测试时，需要根据设备的架构选择合适的版本。 - 尝试集成Crosswalk-WebView时，确保按照官方文档进行...

精选资源

cordova-plugin-native-webview:native本地Webview插件

05-18

cordova-plugin-native-webview 此插件将打开另一个本机Web视图，以在应用程序内很好地显示您的Web资源。在节省时间的情况下，插件支持共享功能，您可以将网站共享到微信。特征分享到微信不错的导航栏 WebView...

JavaScript使用DeviceOne开发实战（二）生成调试安装包

11-22

在上篇文章给大家介绍了JavaScript使用DeviceOne开发实战（一）配置和起步，本篇文章继续给大家介绍关于javascript实战相关内容，一起学习吧。生成调试安装包首先需要说明的是，这个步骤并不是每次调试App都必须的，大部分情况生成一次调试安装包，安装到手机上之后就可以忽略整个这个步骤。因为调试安装包包含了很多原生组件，都是可以定制勾选的，如果你需要额外增加一些原生组件，则需要勾选更多的组件并要重新生成调试安装包。点击调试程序的菜单里的“Build Debug Version”按钮，如果没有登录过，会提示登录如果打开了多个项目，需要选择一个你想要打包的具体项目，打包的

DeviceOne 让你一见钟情的App快速开发平台

10-22

DeviceOne是一个非常先进的App开发平台，使用Javascript 构建原生体验的移动应用程序，DeviceOne主要关注外观和体验，以及和你的应用程序的 UI 交互

数据绑定介绍

weixin_33970449的博客

04-18

192

数据绑定是在应用程序 UI 与数据源建立连接的过程。如果绑定正确数据，则当数据更改其值时，绑定到数据的UI属性值会自动反映更改。DeviceOne支持灵活的数据绑定，使UI展示和数据可以清晰的分离。目前还不支持双向绑定，只支持数据到展示的传递。使用DeviceOne开发App，你可以不使用任何数据bind机制，传统的获取对象，给对象每一个单个属性设置值也可以实现所有功能。但是使用bind机制可以减...

快速开发移动应用的利器

weixin_30469895的博客

05-05

5月1号正式发布的DeviceOne产品，能够快速开发原生UI的跨平台产品。 DeviceOne是什么？ DeviceOne是一个的提供基础服务的移动应用开发平台。也可以简单的理解为：“是一个移动中间件产品”。通过DeviceOne可以轻松实现“一次开发，多平台运行，原生体验效果！”，目前已经可以支持的平台包括IOS、Android、WindowsPhone以及WindowsPC。它能够帮...

百度云推送push与deviceone应用

dqchouyang的专栏

01-05

1123

流程如下：一.ios系统：先申请到开发用的证书，这里包括两个证书，一个.p12文件，一个.mobileprovision文件，两者是配套的。 android系统可以自动创建，简便。二.在deviceone的配置信息中的证书管理里填写申请成功的证书，这里分两个系统，当然也是分别填写的。三.到百度云推送（http://push.baidu.com/）注册应用。应用名可以随便下。

DeviceOne 问题汇总小记

Be a Man Keep fighting for destination

01-08

859

一、 new Date("日期字符串") 该方法将日期字符串转成格林威治时间，需要注意的是在deviceOne中，这种日期格式“yyyy-MM-dd” 在安卓中无法转成格林威志时间，IOS没有问题，所以需要将 yyyy-MM-dd 日期格式的字符串转成 yyyy/MM/dd这种格式，IOS和Android 就没问题二、键盘弹起内容自动往上顶，用scrollView

跨平台之AppCan与DeviceOne对比点评记录

柳絮、

07-14

6437

目前已有的移动中间件开发技术主要包括：IOS、Android或WindowsPhone的纯原生开发；以Html5技术为核心的中间件开发（例如PhoneGap, HBuilder, AppCan, ApiCloud）、以OpenGL技术为核心的中间件开发(例如：CrossApp)、以代码转换和原生反射技术为核心的中间件开发(例如：Titanium，Xamarin，React Native)，以及以虚

deviceone 跨平台开发

从入门到放弃

03-09

1361

lz最近很忙好久没更新blog了好久没搞android了最近一直在学习js语言和跨平台开发工具那么多 lz用的deviceone!说实话真的很快速官方封装的各种框架底层用起来简单的不得了!简单直接粗暴有效果也有各位大神封装的组件 http://study.deviceone.net/ 唯一一点感觉不大爽的是说明文档写的并不详细但基本上有一定基础的人一看就会,

deviceone 开发烦烦索索那些事

从入门到放弃

04-01

1651

目前,项目已经成型不得不说模块类型的开发写起来真的挺爽的但是有爽的自然有不爽的有些地方还是那个样子难处理相比于android原声的还是稍微简单一些官方目前也在积极的更新写了一段收缩展开的逻辑代码先上图我的项目需求是三个以上展开这样我们先来分析一下首先这是个详情界面根布局是滚动布局 do_scrollview 这点勿用

没看到切换上下文 markdown 1. 定位界面底部 "Context" 下拉菜单 2. 查看可用选项（示例）： - NATIVE_APP - WEBVIEW_com.android.chrome 3. 选择包含弹窗元素的上下文

最新发布

09-20

<think> 我们正在处理的是Appium测试自动化中的上下文切换问题。用户已经执行了强制刷新元素树（通过`driver.page_source`），现在需要切换到正确的上下文以定位弹窗元素。重点在于如何定位界面底部的'Context'下拉菜单并操作它，但请注意：在代码中我们并不需要定位这个下拉菜单，因为代码操作和Appium Inspector中的手动操作是两套不同的流程。用户的问题似乎是混淆了代码操作和手动操作（在Appium Inspector中的操作）的区别。让我们明确： 1. **代码中切换上下文**：使用`driver.switch_to.context(context_name)`方法，其中`context_name`是字符串，如`"NATIVE_APP"`或`"WEBVIEW_com.android.chrome"`。 2. **手动操作（在Appium Inspector中）**：用户需要点击界面底部的'Context'下拉菜单来选择上下文。根据用户上一次的问题，他想了解的是在Appium Inspector中如何手动操作。因此，我们将重点放在手动操作部分（因为代码操作部分之前已经给出）。下面是详细的步骤说明： ### 手动在Appium Inspector中切换上下文的步骤 1. **触发弹窗并强制刷新**： - 在Appium Inspector中，先执行触发弹窗的操作（例如点击某个按钮）。 - 触发后立即点击工具栏上的**刷新按钮**（Refresh Source & Screenshot）或使用快捷键（Windows: `Ctrl+R`, Mac: `Cmd+R`）来刷新元素树。这样新的弹窗元素可能会出现在新的上下文中。 2. **定位'Context'下拉菜单**： - 在Appium Inspector界面的**底部**，你会看到一个显示当前上下文的**下拉菜单**（通常默认显示为`NATIVE_APP`）。 - 该下拉菜单位于界面底部中间位置，通常显示为当前上下文的名称，旁边有一个向下箭头。 3. **查看可用选项**： - 点击这个下拉菜单，会展开一个列表，显示所有可用的上下文。 - 例如： ``` NATIVE_APP WEBVIEW_com.android.chrome WEBVIEW_com.example.app ``` 4. **选择包含弹窗元素的上下文**： - 根据弹窗的类型选择： - 如果是系统原生弹窗（如Android的AlertDialog），选择`NATIVE_APP`。 - 如果是WebView弹窗（例如应用内嵌浏览器弹出的对话框），选择对应的`WEBVIEW_`开头的上下文（通常有多个时，可以逐个切换尝试）。 - 选择后，Appium Inspector会自动刷新元素树，显示所选上下文中的元素。 5. **验证元素是否可见**： - 切换上下文后，查看元素树中是否出现了弹窗元素。 - 可以使用元素定位工具（如坐标点击）尝试点击弹窗上的按钮，看是否能够操作。 ### 注意事项 - **上下文切换后刷新延迟**：切换上下文后，Appium Inspector可能需要几秒钟来加载新上下文的元素结构，请耐心等待。 - **嵌套上下文**：对于复杂的混合应用（Hybrid App），可能会有多层WebView上下文，需要切换到正确的层级。 - **上下文数量**：如果下拉菜单中只有一个`NATIVE_APP`选项，说明当前没有WebView上下文，弹窗可能是原生类型。 ### 代码中上下文切换的补充说明（供参考）虽然在手动操作中我们不需要写代码，但为了完整性，这里补充代码切换上下文的示例（已在之前的回答中给出，这里再强调一下）： ```python # 获取所有可用上下文 contexts = driver.contexts print("可用上下文列表:", contexts) # 切换到第一个WebView上下文（如果有多个WebView，可能需要根据需求选择） webview_context = None for context in contexts: if context.startswith('WEBVIEW_'): webview_context = context break if webview_context: driver.switch_to.context(webview_context) print("已切换到上下文:", webview_context) else: # 如果没有WebView，切换回原生上下文 driver.switch_to.context('NATIVE_APP') print("已切换到原生上下文") # 现在可以在新上下文中查找元素 ``` ### 相关问题 §§相关问题§§ 1. 在Appium Inspector中切换上下文后，元素树仍然没有更新怎么办？ 2. 如何处理混合应用（Hybrid App）中的多层嵌套WebView？ 3. 如何通过Appium日志判断上下文切换是否成功？ </think> ### 在 Appium Inspector 中手动切换上下文的操作指南 #### 定位并操作上下文下拉菜单的完整步骤 1. **定位界面底部 Context 下拉菜单** - 在 Appium Inspector 界面底部工具栏找到 **Context 下拉菜单** - 位置参考图示： ``` [ Inspector 界面布局 ] +------------------------------+ | 元素树显示区域 | | | +------------------------------+ | [元素定位工具] [Context▼] [刷新] | ← 底部工具栏 +------------------------------+ ``` - 标识特征：显示当前上下文名称（如 `NATIVE_APP`）的下拉框 2. **查看可用选项** - 点击下拉箭头展开上下文列表 - 典型选项示例： ```markdown > NATIVE_APP (原生应用上下文) > WEBVIEW_com.android.chrome (WebView 上下文) > WEBVIEW_com.example.app (其他 WebView 上下文) ``` 3. **选择包含弹窗元素的上下文** - **原生弹窗**：选择 `NATIVE_APP` - **WebView 弹窗**：选择匹配的 `WEBVIEW_包名` - **混合弹窗**：根据应用包名选择（如：`WEBVIEW_com.yourapp`） - 操作后界面自动刷新显示新上下文的元素树[^2] #### Python 代码实现上下文切换 ```python # 获取所有可用上下文 contexts = driver.contexts print(f"可用上下文: {contexts}") # 切换到目标上下文（二选一） # 方案1：切换到首个 WEBVIEW webview_context = next((ctx for ctx in contexts if "WEBVIEW" in ctx), None) if webview_context: driver.switch_to.context(webview_context) # 方案2：根据包名精确切换 target_context = "WEBVIEW_com.android.chrome" # 替换为实际包名 if target_context in contexts: driver.switch_to.context(target_context) # 切换到 NATIVE_APP（备用方案） else: driver.switch_to.context("NATIVE_APP") # 验证切换效果 print(f"当前上下文: {driver.current_context}") ``` #### 关键注意事项 1. **上下文切换时机** - 必须在触发弹窗**后**刷新元素树**前**执行切换 ```python driver.find_element(By.ID, "btn_show_dialog").click() # 触发弹窗 driver.switch_to.context("NATIVE_APP") # 立即切换 driver.page_source # 最后刷新 ``` 2. **常见问题排查** - **下拉菜单不可见**： - 确保设备已启用 WebView 调试（Android: `WebView.setWebContentsDebuggingEnabled(true)`） - 检查 Appium Desired Capabilities 是否包含 `"autoWebview": true`[^1] - **WEBVIEW 选项缺失**： ```python # 添加 ChromeDriver 配置 caps = { "chromedriverExecutable": "/path/to/chromedriver", "autoWebviewTimeout": 5000 # 增加超时时间 } ``` 3. **最佳实践** - 使用上下文监听自动切换： ```python # 监听新上下文出现 original_context = driver.current_context driver.execute_script("mobile: deepLink", {"url": "app-scheme://dialog"}) # 等待新上下文出现 WebDriverWait(driver, 10).until( lambda d: len(d.contexts) > len([original_context]) ) driver.switch_to.context(driver.contexts[-1]) ``` > 通过正确的上下文切换，可解决90%的弹窗定位问题。复杂场景建议结合 `driver.get_screenshot_as_base64()` 进行视觉验证[^2]。