【问题标题】:How do I make an iPhone web app mimic a non-web app?如何让 iPhone 网络应用模仿非网络应用?
【发布时间】:2010-09-30 12:57:46
【问题描述】:

我一直在考虑制作一个快速的小型 iPhone 网络应用程序。

我开始阅读并尝试使用 Apple's Web Apps Dev Center 记录的特殊元标记和属性:

  • 视口
  • apple-mobile-web-app-capable
  • apple-mobile-web-app-status-bar-style
  • -webkit-border-radius
  • -webkit-border-image
  • 自动更正
  • 自动大写
  • 苹果触摸图标
  • -webkit-text-size-adjust

这让我想到,必须有一个很好的指南可以遵循,以最好地模仿设备的非 Web 应用程序的默认样式和行为。

然后我偶然发现了Joe HewittiUI project

它有两个令人印象深刻的演示:

是否有我应该使用的替代库、指南或其他资源?

【问题讨论】:

  • 记录在案(以及所有通过 Google 在这里偶然发现的人):iUI 项目现在是 0.30 版(2009 年 8 月 6 日)。

标签: html css iphone safari


【解决方案1】:

在测试了几个 iphone web app 的 UI 框架后,我认为JQTouch 是最好的

【讨论】:

  • 还有 Sencha Touch,因为它们集成了 JQTouch 和 Raphael ;)
【解决方案2】:

查看 iUI 库-http://code.google.com/p/iui/

基于 Joe Hewitt 的 iPhone 导航作品,iUI 具有以下特点:

  • 从标准 HTML 创建导航菜单和 iPhone 界面
  • 创建基本的 iPhone 页面不需要使用或了解 JavaScript
  • 能够处理手机方向变化
  • 为 Web 应用程序(在 iPhone 上或在 iPhone 下)提供更“类似 iPhone”的体验

【讨论】:

    【解决方案3】:

    除了大多数库(例如 scriptaculous 等)都可以实现的精美效果之外……iPhone 网络应用程序中发生的一件有趣的事情是“#”后退按钮兼容,即使是 ajax 调用,您也可以在 Google 上搜索“真正简单的历史”以找到在这种情况下使用的正确库。

    如果你使用 jQuery,你可能还想看看这个:http://plugins.jquery.com/project/iphone

    【讨论】:

      【解决方案4】:

      您看过iPhoneWebDev 网站吗?

      还可以查看 Richard Wagner 的《Professional iPhone and iPod touch Programming: Building Applications for Mobile Safari》一书。

      【讨论】:

        【解决方案5】:

        2010 年 2 月 12 日,theappleblog.com 的 Andrew Flocchini 撰写了一份使用 iWebKit 框架包为 iPod Touch、iPhone 和 iPad 优化网站表单的指南。

        name and password field change http://gigapple.files.wordpress.com/2010/02/namechage.png?w=570&h=202

        How-To: Create an iPhone Web App

        【讨论】:

          【解决方案6】:

          我认为iPhone Web App最好的框架是jQTouchhttp://www.jqtouch.com/它是一个jQuery插件。您可以查看由 jQTouch 构建的 Showtime 应用程序。

          【讨论】:

            【解决方案7】:

            看看Swipy.js。我不喜欢这些框架的工作方式,所以我做了这个,其中包括其他伟大的项目:

            它使用 Modernizr 逐步增强,使用 jquery.transit 添加平滑过渡,使用 Hammer.js 添加边缘滑动向后/向前导航,添加 FastClick 用于点击,使用 Waypoints 解决内部链接和带有 FontAwesome 图标的漂亮导航栏。

            享受:)

            【讨论】:

              猜你喜欢
              • 1970-01-01
              • 2011-09-19
              • 2023-04-01
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 2014-03-04
              相关资源
              最近更新 更多