ionic开发常见问题及解决方案（三）

1 .如何生成应用图标与启动页面背景：安卓与iOS

a.进入resources文件夹；

b.把resources目录下默认的icon（应用图标）和splash图标（启动界面图标）换成当前APP对应的图标；

c.把resources目录下android和ios文件夹删除

d. 执行ionic resources 命令，会自动生成各种尺寸的图标。


注意：
     I.  icon图像文件大小最小192×192 px，且不能为圆角；splash图像文件大小最小2208x2208px。格式可以为 .png、.psd、.ai

     II.  ionic resources 执行以后发现没有生成，首先检查图片尺寸（必须满足条件），其次是网络。

     III .若是ios与安卓的图标需要有区别的话，则将对应的图标如下放置  resources/android/icon.png ；resources/ios/icon.png 

     可参考：[Ionic 自动创建应用的图标与启动画面【译】]
           http://ionichina.com/topic/54e455ab2be672f1111c01e2

http://blog.csdn.net/zapzqc/article/details/42237935

 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

2 . ionic 开发应用时，发现在某些小屏幕设备上个别页面有问题，在大屏上没有问题。如在iPhone4s （3.5寸）和iPhone5s等上有问题。

解决方案：

     可以个这些设备专门写一些样式处理问题。
     利用css中的media来：例:
      @media screen and (max-width: 320px) {
        .leftText {
            float: left;
            display: inline;
            font-size: 13px;
        }
    }
    上面的例子是说：当屏幕宽度<=320px   (iPhone 5s的宽度)
    时候，leftText类的css样式为 float: left;display: inline; font-size: 13px;
具体可参考：【css判断不同分辨率显示不同宽度布局实现自适应宽度】http://www.jb51.net/css/151312.html

 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

3. ionic使用 HTML5 中type=”date” 以及type=”time” 如何设置日期格式，与时间制

问题  ：日期：我们有些设备日期是英文，有些是中文，有些是日文等等 ；
       时间：有些是12小时制，有些是24小时制；上午，下午，各种语言都有；   

解决方案：如果使用这个date 或time调用系统的日期或者时间选择器，是无法控制的，因为选择器是根据设备系统来的，用户设置什么就是什么语言或时间制；
        除非放弃type="date"  以及type="time";

        当然，angularJS提供了过滤器，可以使我们将用户选择的数据格式化，也就是说不管用户的语言或者时间制是什么，我们都能将数据格式化然后传给后台 ；
        例：
         var confObj = {
                "dateItemNew": $filter('date')(new Date(originalPostObj.dateItem), 'yyyy-MM-dd'),
                "startTimeNew": $filter('date')(new Date(originalPostObj.startTime), 'HH:mm'),    
                "applicationTypeNew": originalPostObj.applicationType
             };
        originalPostObj是选择框传过来的数据，

        dateItem（input type="date"）是一个日期格式字符串：例如 ：Mon Oct 10 2016 08:00:00 GMT+0800 (中国标准时间),时间是默认加上去的；

        startTime（input type="time"）也是Thu Jan 01 1970 12:12:00 GMT+0800 (中国标准时间);日期是默认加上去的


      需求是：将dateItem格式化为yyyy-MM-dd
               startTime格式化为HH:mm


使用$filter 如代码所示：

注意 需要     .controller('ApplicationCtrl', ['$filter', function( $filter) {           }])




附录 ： 若是非要使用特定的选择器。。。。只能使用弹出框选择器了，  
https://github.com/ahmerafzal/Ionic-Datepicker 
 (在ios上最好还是用原生的因为漂亮，弹出框不怎么美观；
 安卓上的话，可以用第三方的，因为原生的不怎么美观。
 其实吧，没必要规定选择器的格式啊，就根据用户的设备呗，
 腾讯的手机qq就是根据用户的系统来的。。。。
 当然，最主要的是说服产品)



 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

4. cordova plugin add cordova-plugin-device 失败 报错：

Error: connect ETIMEDOUT 50.17.177.14:80
    at Object.exports._errnoException (util.js:873:11)
    at exports._exceptionWithHostPort (util.js:896:20)
    at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1077:14)
 
 
1
2
3
4
 
 
1
2
3
4

解决方法：

换成：
cordova plugin add https://github.com/apache/cordova-plugin-device.git
 
 
1
2