06 2016 档案

摘要:ui-router 的工作原理非常类似于 Angular 的路由控制器,但它只关注状态。 • 在应用程序的整个用户界面和导航中,一个状态对应于一个页面位置 • 通过定义controller、template和view等属性,来定义指定位置的用户界面和界面行为 • 通过嵌套的方式来解决页面中的一些重复 阅读全文
posted @ 2016-06-25 21:00 Mac.Manon 阅读(15118) 评论(0) 推荐(0)
摘要:找到我们项目下面 res下面的config.xml,然后加入下面两句就可以解决。 阅读全文
posted @ 2016-06-24 17:14 Mac.Manon 阅读(468) 评论(0) 推荐(0)
摘要:你只需要一个目录和两张图片就可以搞定。图片可以是 .png 的,Photoshop的 .psd,或者Illustrator的 .ai,(例如)命名为icon.png和splash.png。把这些图片放到资源目录 ./resources ,ionic resources 命令就会为项目里的每一个平台生成图标和启动页,把他们交给Ionic的缩放剪切服务器,所以你不需要安装扩展依赖。执行完后,And... 阅读全文
posted @ 2016-06-24 16:16 Mac.Manon 阅读(833) 评论(0) 推荐(0)
摘要:Ionic 默认的 Tabs 模板 ,Android的在上方,IOS的在下方。在www/js/app.js修改配置,添加一个变量,再修改相应属性: 然后再在Android平台上调试 Tabs就在下面了 并且别的组件工作也正常   特别注意 Cordova的配置一定要正确 尤其是Android A 阅读全文
posted @ 2016-06-22 20:22 Mac.Manon 阅读(911) 评论(0) 推荐(0)
摘要:本模板和以前的方式不同,采用的是 iframe方式引入的视频,如下代码: 阅读全文
posted @ 2016-06-22 18:51 Mac.Manon 阅读(2712) 评论(0) 推荐(0)
摘要:onic登陆页面模板源码,可以用于ionic开发中登陆页面制作或者参考下面是此模板的一些页面此模板免费提供给大家 登陆用户名和密码都是 phonegap100 阅读全文
posted @ 2016-06-22 18:47 Mac.Manon 阅读(2421) 评论(2) 推荐(0)
摘要:Ionic 音乐以及社交页面,可以用于二次开发,也可以用于社交或者音乐app页面模板,但是不足的是图片没法预览。 阅读全文
posted @ 2016-06-22 18:46 Mac.Manon 阅读(783) 评论(0) 推荐(0)
摘要:onic日期选择控件,用于ionic项目开发中的日期选择以及日期插件 阅读全文
posted @ 2016-06-22 18:31 Mac.Manon 阅读(2847) 评论(0) 推荐(0)
摘要:ionic图表demo基于Highcharts,highcharts 是一个用纯JavaScript编写的一个图表库, 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表。HighCharts支持的图表类型有曲线图、区域图、柱状图、饼状图、散状点图和综合图表。我们知道Highcharts是基于jquery的,要使用Highcharts的话就必须在ionic中引入jquery 和Hig... 阅读全文
posted @ 2016-06-22 18:26 Mac.Manon 阅读(1144) 评论(0) 推荐(0)
摘要:此产品是一款Ionic版微博、微信、朋友圈效果(微博、微信、聊天列表、聊天窗口、个人界面、编辑个人信息等)购买后二次开发方便快捷。 阅读全文
posted @ 2016-06-22 18:20 Mac.Manon 阅读(1629) 评论(3) 推荐(0)
摘要:这个demo的主要功能有两个,一个是首页的导航向上拉动会浮动在最上面的效果,另一个就是我们平时非常实用的功能,就是图片预览功能点击可以放大图片,并且可以左右滑动,还可以双击放大缩小图片以及双手指控制图片的大小,有点类似汽车之家的图片预览功能iClub theme主要功能Included ionic pluginsIonic Filter BarIonic Gallery ()Ionic ... 阅读全文
posted @ 2016-06-22 18:12 Mac.Manon 阅读(6736) 评论(1) 推荐(0)
摘要:用户名密码都为空此app功能主要有如下1.首页轮播和商品列表展示2.左侧侧滑页面分类展示3.商品详情页面展示 以及购买4.购物车 订单填写 支付等页面 阅读全文
posted @ 2016-06-22 18:08 Mac.Manon 阅读(1231) 评论(1) 推荐(0)
摘要:github下载地址:https://github.com/Frogmarch/ionic-wechat博客学习地址:http://www.cnblogs.com/Frogmarch/Ionic仿照微信项目源码-边开发边学,强烈建议,做ionic之前把angularJS入门过一遍, 还有ui-router, 至少要了解个大概, 不然真做不下去 阅读全文
posted @ 2016-06-22 18:04 Mac.Manon 阅读(3268) 评论(0) 推荐(0)
摘要:ion-tabs ion-tabs 是有一组页面选项卡组成的选项卡栏。可以通过点击选项来切换页面。 对于 iOS,它会出现在屏幕的底部,Android会出现在屏幕的顶部(导航栏下面)。 用法    ion-tab 隶属于ionTabs 包含一个选项卡内容。该内容仅存在于被选中的给定选项卡中。 阅读全文
posted @ 2016-06-17 17:58 Mac.Manon 阅读(1725) 评论(0) 推荐(0)
摘要:ion-spinner ionSpinner 提供了许多种旋转加载的动画图标。当你的界面加载时,你就可以呈现给用户相应的加载图标。 该图标采用的是SVG。  实例 HTML 代码 CSS 代码 JavaScript 代码  阅读全文
posted @ 2016-06-17 17:51 Mac.Manon 阅读(1071) 评论(0) 推荐(0)
摘要:ion-slide-box 滑动框是一个包含多页容器的组件,每页滑动或拖动切换: 效果图如下:   用法  HTML 代码 CSS 代码 JavaScript 代码   阅读全文
posted @ 2016-06-17 17:45 Mac.Manon 阅读(539) 评论(0) 推荐(0)
摘要:一个容器元素包含侧边菜单和主要内容。通过把主要内容区域从一边拖动到另一边,来让左侧或右侧的侧栏菜单进行切换。 效果图如下所示:   用法 要使用侧栏菜单,添加一个父元素,一个中间内容 ,和一个或更多 指令。    ion-side-menu-content 一个可见主体内容的容器,同级的一 阅读全文
posted @ 2016-06-17 17:37 Mac.Manon 阅读(2336) 评论(0) 推荐(0)
摘要:ion-scroll ion-scroll 用于创建一个可滚动的容器。  HTML 代码 CSS 代码 JavaScript 代码 ion-infinite-scroll 当用户到达页脚或页脚附近时,ionInfiniteScroll指令允许你调用一个函数 。 当用户滚动的距离超出底部的内容时,就 阅读全文
posted @ 2016-06-17 17:26 Mac.Manon 阅读(656) 评论(0) 推荐(0)
摘要:$ionicPopup ionic 对话框服务允许程序创建、显示弹出窗口。 $ionicPopup 提供了3个方法:alert(), prompt(),以及 confirm() 。 实例 HTML 代码 JavaScript 代码     阅读全文
posted @ 2016-06-17 17:00 Mac.Manon 阅读(462) 评论(0) 推荐(0)
摘要:$ionicPopover $ionicPopover 是一个可以浮在app内容上的一个视图框。 实例 HTML 代码 JavaScript 代码  阅读全文
posted @ 2016-06-17 16:54 Mac.Manon 阅读(1142) 评论(0) 推荐(0)
摘要:$ionicPlatform$ionicPlatform 用来检测当前的平台,以及诸如在PhoneGap/Cordova中覆盖Android后退按钮。 阅读全文
posted @ 2016-06-17 16:51 Mac.Manon 阅读(286) 评论(0) 推荐(0)
摘要: ion-nav-view 当用户在你的app中浏览时,ionic能够检测到浏览历史。通过检测浏览历史,实现向左或向右滑动时可以正确转换视图。 采用AngularUI路由器模块等应用程序接口可以分为不同的$state(状态)。Angular的核心为路由服务,URLs可以用来控制视图。 Angula 阅读全文
posted @ 2016-06-17 16:38 Mac.Manon 阅读(5539) 评论(0) 推荐(0)
摘要:ionicModal 可以遮住用户主界面的内容框。 你可以在你的 index 文件或者是其他文件内嵌入以下代码(里面的代码可以根据你自己的业务场景相应的改变)。 然后你就可以在你的 Controller 里面的注入 $ionicModal 。然后调用你刚刚写入的模板,进行初始化操作。就像下面的代码: 阅读全文
posted @ 2016-06-17 12:12 Mac.Manon 阅读(485) 评论(0) 推荐(0)
摘要:$ionicLoading 是 ionic 默认的一个加载交互效果。里面的内容也是可以在模板里面修改。 用法 方法 显示一个加载效果。  隐藏一个加载效果。  实例 HTML 代码 JavaScript 代码    阅读全文
posted @ 2016-06-17 11:53 Mac.Manon 阅读(550) 评论(0) 推荐(0)
摘要:列表是一个应用广泛在几乎所有移动app中的界面元素。ionList 和 ionItem 这两个指令还支持多种多样的交互模式,比如移除其中的某一项,拖动重新排序,滑动编辑等等。 高级用法: 缩略图,删除按钮,重新排序,滑动  实例 HTML 代码: CSS 代码 JavaScript 代码   阅读全文
posted @ 2016-06-17 11:19 Mac.Manon 阅读(499) 评论(0) 推荐(0)
摘要:1.ion-header-bar 这个是固定在屏幕顶部的一个头部标题栏。如果给它加上'bar-subheader' 这个样式,它就是副标题。   2.ion-footer-bar 知道了 ion-header-bar ,理解ion-footer-bar就轻松多啦!只是 ion-footer-ba 阅读全文
posted @ 2016-06-17 10:48 Mac.Manon 阅读(360) 评论(0) 推荐(0)
摘要:1.on-hold 长按的时间是500毫秒。 HTML 代码 JavaScript 代码 2.on-tap 这个是手势轻击事件,如果长按时间超过250毫秒,那就不是轻击了。 HTML 代码 JavaScript 代码 3.on-double-tap 手双击屏幕事件 HTML 代码 代码 JavaSc 阅读全文
posted @ 2016-06-17 10:02 Mac.Manon 阅读(1095) 评论(0) 推荐(0)
摘要:以下实例中,通过切换不同开关 checked 显示不同的值,true 为打开,false 为关闭。 HTML 代码 由于pre标签冲突,实例中的 pre 已替换为 div标签,具体可以在"尝试一下"中查看。 JavaScript 代码 css 代码   阅读全文
posted @ 2016-06-16 17:14 Mac.Manon 阅读(499) 评论(0) 推荐(0)
摘要:实例中,根据选中的不同选项,显示不同的值。 HTML 代码 JavaScript 代码 css 代码   阅读全文
posted @ 2016-06-16 17:10 Mac.Manon 阅读(763) 评论(0) 推荐(0)
摘要:ionic 复选框(checkbox)与普通的 HTML 复选框没什么区别,以下实例演示了 ionic 复选框 ion-checkbox 的应用。 实例中,会根据复选框是否选中,修改 checked 值,true 为选中, false 为未选中。 HTML 代码 JavaScript 代码 css 阅读全文
posted @ 2016-06-16 17:04 Mac.Manon 阅读(1705) 评论(0) 推荐(0)
摘要:在加载新数据的时候,我们需要实现下拉刷新效果,代码如下: HTML 代码 JavaScript 代码 item.json 文件数据:  阅读全文
posted @ 2016-06-16 16:32 Mac.Manon 阅读(665) 评论(0) 推荐(0)
摘要:我们经常需要在 UI 上,例如在弹出框、加载框、其他弹出层中显示或隐藏背景层。 在组件中可以使用\(ionicBackdrop.retain()来显示背景层,使用\)ionicBackdrop.release()隐藏背景层。 每次调用retain后,背景会一直显示,直到调用release消除背景层。 阅读全文
posted @ 2016-06-16 16:16 Mac.Manon 阅读(648) 评论(0) 推荐(0)
摘要:上拉菜单(ActionSheet)通过往上弹出的框,来让用户选择选项。 非常危险的选项会以高亮的红色来让人第一时间识别。你可以通过点击取消按钮或者点击空白的地方来让它消失。 HTML 代码 JavaScript 代码 在代码中触发上拉菜单,需要在你的 angular 控制器中使用 $ionicAct 阅读全文
posted @ 2016-06-16 16:12 Mac.Manon 阅读(1108) 评论(0) 推荐(0)
摘要:ionic 也默认提供了许多的图标,大概有500多个。用法也非常的简单: 图标列表如下:                               阅读全文
posted @ 2016-06-16 15:53 Mac.Manon 阅读(885) 评论(0) 推荐(0)
摘要:ionic 提供了很多颜色的配置,当然你可以根据自己的需要自定义颜色。  阅读全文
posted @ 2016-06-16 14:43 Mac.Manon 阅读(491) 评论(0) 推荐(0)
摘要:1.Header(头部) Header是固定在屏幕顶部的组件,可以包如标题和左右的功能按钮。 ionic 默认提供了许多种颜色样式,你可以调用不同的样式名,当然也可以自定义一个。          2.Sub Header(副标题) Sub Header同样是固定在顶部,只是是在H 阅读全文
posted @ 2016-06-16 14:37 Mac.Manon 阅读(654) 评论(0) 推荐(0)
摘要:ionic tab(选项卡) 是水平排列的按钮或者链接,用以页面间导航的切换。它可以包含文字和图标的组合,是一种移动设备上流行的导航方法。 1.基本用法 以下选项卡容器使用了 tabs 类,每个选项卡使用 tab-item 类。默认情况下,选项卡是文本的,并没有图标。  默认情况,选项卡颜色为默认 阅读全文
posted @ 2016-06-16 14:02 Mac.Manon 阅读(2700) 评论(0) 推荐(0)
摘要:1.基本使用 按钮是移动app不可或缺的一部分,不同风格的app,需要的不同按钮的样式。 默认情况下,按钮显示样式为:display: inline-block。  2.button-block button-block 样式按钮显示为:display: block,它将完全填充父元素的宽度,包含 阅读全文
posted @ 2016-06-16 13:39 Mac.Manon 阅读(804) 评论(0) 推荐(0)
摘要:一、输入框 list 类同样可以用于 input 元素。item-input 和 item 类指定了文本框及其标签。 1.输入框属性:placeholder 以下实例中,默认为100%宽度(左右两侧没有边框),并使用 placeholder 属性设置输入字段预期值的提示信息。  2.输入框属性:i 阅读全文
posted @ 2016-06-16 13:35 Mac.Manon 阅读(7191) 评论(0) 推荐(0)
摘要:近年来卡片(card)的应用越来越流行,卡片提供了一个更好组织信息展示的工具。 针对移动端的应用,卡片会根据屏幕大小自适应大小。 我们可以很灵活的控制卡片的显示效果,甚至实现动画效果。 卡片一般放在页面顶部,当然也可以实现左右切换的功能。 1.基本卡片  卡片(card)默认样式带有box-sha 阅读全文
posted @ 2016-06-16 12:29 Mac.Manon 阅读(986) 评论(0) 推荐(0)
摘要:列表是一个应用广泛的界面元素,在所有移动app中几乎都会使用到。 列表可以是基本文字、按钮,开关,图标和缩略图等。 列表项可以是任何的HTML元素。容器元素需要list类,每个列表项需要使用item类。 ionList和ionItem可以很容易的支持各种交互方式,比如,滑动编辑,拖动排序,以及删除项 阅读全文
posted @ 2016-06-16 11:20 Mac.Manon 阅读(829) 评论(0) 推荐(0)
摘要:ionic 的网格(Grid)和其他大部分框架有所不同,它采用了弹性盒子模型(Flexible Box Model) 。而且在移动端,基本上的手机都支持。row 样式指定行,col 样式指定列。 1.同等大小网格 在带有 row 的样式的元素里如果包含了 col 的样式,col 就会设置为同等大小。 阅读全文
posted @ 2016-06-16 08:53 Mac.Manon 阅读(7292) 评论(0) 推荐(0)
摘要:1.在终端中输入如下命令,创建一个名为的simple-service-webapp项目:mvn archetype:generate -DarchetypeArtifactId=jersey-quickstart-webapp \-DarchetypeGroupId=org.glassfish.jersey.archetypes -DinteractiveMode=false \-DgroupId... 阅读全文
posted @ 2016-06-14 14:24 Mac.Manon 阅读(687) 评论(0) 推荐(0)
摘要:1.项目有了,在终端窗口进入项目的根目录(即 \simple-service )2.现在先测试运行下:mvn clean test项目将会被编译,并且进行单元测试上面可以看看到测试通过。3.下面我们用标准模式运行项目,输入:mvn exec:java4.项目已经运行,项目的 WADL 描述存在于http://localhost:8080/myapp/application.wadl URI... 阅读全文
posted @ 2016-06-14 11:42 Mac.Manon 阅读(1068) 评论(0) 推荐(0)
摘要:1.用Ctrl+空格调出Spotlight搜索,输入ter调出终端窗口  2.在终端窗口进入将创建jersey项目的目录:  3.输入如下命令,创建一个名为的simple-service项目: mvn archetype:generate -DarchetypeArtifactId=jersey 阅读全文
posted @ 2016-06-14 09:43 Mac.Manon 阅读(849) 评论(0) 推荐(0)