Learning Path
浏览 Ionic 相关教程与章节。
iOS、Android、Flutter、Ionic、Electron 与跨平台客户端。
教程
38
ionic 切换开关操作 以下实例中,通过切换不同开关 checked 显示不同的值,true 为打开,false 为关闭。 HTML 代码 开关切换 Settings {{ item.text }} Notifi..
ionic 背景层 我们经常需要在 UI 上,例如在弹出框、加载框、其他弹出层中显示或隐藏背景层。 在组件中可以使用$ionicBackdrop.retain()来显示背景层,使用$ionicBackdrop.release()隐藏背景层。 每次调用retain后,背景会一直显示,直到调用release消除背景层。 实例 HTML 代码 $ionicBackdrop Java..
ionic 加载动作 $ionicLoading 是 ionic 默认的一个加载交互效果。里面的内容也是可以在模板里面修改。 用法 angular.module('LoadingApp', ['ionic']) .controller('LoadingCtrl', function($scope, $ionicLoading) { $scope.show = functi..
ionic 平台 $ionicPlatform $ionicPlatform 用来检测当前的平台,以及诸如在PhoneGap/Cordova中覆盖Android后退按钮。 方法 onHardwareBackButton(callback) 有硬件的后退按钮的平台,可以用这种方法绑定到它。 参数 类型 详情 ..
ionic 浮动框 $ionicPopover $ionicPopover 是一个可以浮在app内容上的一个视图框。 可以实现以下功能点: 在当前页面显示更多信息。 选择一些工具或配置。 在页面提供一个操作列表。 方法 fromTemplate(templateString, options) 或 fromTemplateUrl(templateUrl, options) 参数说明: templateString..
ionic 对话框 $ionicPopup ionic 对话框服务允许程序创建、显示弹出窗口。 $ionicPopup 提供了3个方法:alert(), prompt(),以及 confirm() 。 实例 HTML 代码 弹窗显示 确认对话框 警告框 JavaScript 代码 angular.module('mySuperApp', [�..
ionic 列表 列表是一个应用广泛的界面元素,在所有移动app中几乎都会使用到。 列表可以是基本文字、按钮,开关,图标和缩略图等。 列表项可以是任何的HTML元素。容器元素需要list类,每个列表项需要使用item类。 ionList和ionItem可以很容易的支持各种交互方式,比如,滑动编辑,拖动排序,以及删除项。 基本用法: ... 尝试一下 » 列表分隔符 我们可以使用 item-divi..
ionic 单选框 ionic 单选按钮与标准 type='radio' 的 input元素类似。以下展示了现代app类型的单选按钮。 每个 item-radio 中的 type='radio' 的 input 元素的 name 属性都相同。radio-icon 类用于是否显示图标。 ionic 在单选项中使用了 <label> 元素,使其更易点击。 实例 [my..
ionic Range ionic Range 是一个滑块控件,ionic 为 Range 提供了很多种默认的样式。而且你可以在许多种元素里使用它比如列表或者 Card 。 实例 Ranges In A List ..
ionic 滚动条 ion-scroll ion-scroll 用于创建一个可滚动的容器。 用法 ... API 属性 类型 详情 delegate-handle (可选) 字符串 ..
ionic select ionic select 的 select 相比原生的要更加美观些。但是弹出的可选选项样式是浏览器默认的。 每个平台上的可选项样式都是不一样的,在PC电脑的浏览器上,你会看到传统的下拉界面,Android 上会弹出单选按钮选项,iOS 有个滚轮操作界面。 实例 Lightsaber Blue Green Red ..
ionic tab(选项卡) ionic tab(选项卡) 是水平排列的按钮或者链接,用以页面间导航的切换。它可以包含文字和图标的组合,是一种移动设备上流行的导航方法。 以下选项卡容器使用了 tabs 类,每个选项卡使用 tab-item 类。默认情况下,选项卡是文本的,并没有图标。 实例 主页 收藏 设置 尝试一下 » 默认情况,选项卡颜色为默认,你可以设置以下不..
ionic Toggle(切换开关) 切换开关类似与 HTML 的 checkbox 标签,但它更易于在移动设备上使用。 切换开关可以使用 toggle-assertive 来指定颜色。 该实例有是多个切换开关列表。注意,每个选项的 item 类后需要添加 item-toggle 类。 HTML5 ..
ionic 教程 ionic 是一个强大的 HTML5 应用程序开发框架(HTML5 Hybrid Mobile App Framework )。 可以帮助您使用 Web 技术,比如 HTML、CSS 和 Javascript 构建接近原生体验的移动应用程序。 ionic 主要关注外观和体验,以及和你的应用程序的 UI 交互,特别适合用于基于 Hybrid 模式的 HTML5 移动应用程序开发。 ionic是一个轻量的手机UI库..