6月 202016
 

mui-indicator默认的样式比较丑,也是大众的样式。非active为灰色+阴影,active白色。位置居中。外观是圆形。于是,就想,默认的样式那么难看,可不可以自己定义样式呢。答案是当然是可以的。

可以先去看看mui.css的源码,找到对应的样式,看看原来样式是怎么写的,这样才好修改。于是,根据样式表的优先级原则(就近原则)。也就是内联样式表(标签内部)> 嵌入样式表(当前文件中)> 外部样式表(外部文件中)。所以,可以在嵌入样式表中重写mui-indicator样式。这个有点像子类重写父类方法一样。

.mui-slider-indicator
{
    text-align: right;  /*右对齐*/
    right: 20px;  /*右边20像素*/
}

.mui-slider-indicator .mui-indicator
{
    background: #ffffff;  /*默认背景颜色*/
    width:8px;   /**/
    height:8px;  /**/
    border-radius: 50%;  /*弧度50%,这样外观表现是圆。去掉之后,是正方形*/
    -webkit-box-shadow: none; /*去掉阴影*/
    box-shadow:none;  /*去掉阴影*/
}

.mui-slider-indicator .mui-active.mui-indicator
{
    background: #fb7299; /*active状态下背景颜色*/
}

 Posted by at 上午10:46
6月 132016
 

有时候,我们会遇到这种情况。A服务器下的php环境去请求B服务器下的mysql。默认状态下,mysql是禁止连接的。这个时候,就得想办法打破这个禁止。网上查了下,通常有两个办法。

1,修改user表中的host,将host的localhost字段改为%。

2,指定特定数据库,特定ip,特定的用户名,特定的密码远程访问。

这两种方法,我都尝试过了。当使用第一种方法后,发现是可以远程连接mysql了。可是,phpmyadmin和linux命令都登录不上mysql了。因为对mysql的不了解。也没找到好办法。最后,不得不通过命令绕过密码,修改user表,将host字段的值又改回localhost了。于是,去尝试第二种方法。当跑完第二种方法后。也是可以远程连接mysql了。功能已经实现。然后再去查看user表,发现在user表中,增加了一条第二种方法中创建的时,所填充的数据。这个时候猜想,是不是可以手动在表中创建一条记录也可以呢。不需要在liunx下敲一条条的命令来创建。

不过,当熟悉了linux的命令,敲着敲着也蛮好的。下边来实际操作一遍上边的两种方法吧。
Continue reading »

6月 122016
 

input有maxlength属性,可以控制输入的最大长度。而textarea没有。这个时候,只能通过手动的形式来限制textarea的输入长度。既然手动形式,那么我们就从用户的操作出发,也就是用户的键盘输入操作。可有时候,用户不一定通过键盘输入,有时候是通过复制粘贴来实现。那么侦听什么事件比较好呢。

请看这篇文章:http://blog.csdn.net/sunlylorn/article/details/6123355

为了照顾兼容性。ios下app走的都不是ie这条路。可以不必要加那些if。为了其它端。比如网页端等,还是加上了。在这里用onpropertychange,onchange就可以了。 Continue reading »

6月 122016
 

在进行输入操作的时候,就会和光标和键盘打交道。一个体验好的APP,光标和键盘的表现也会非常好。比如,有的app账号只能是手机号码。这个时候,弹出的键盘的默认输入法就是数字的。想象下这样一个场景,用户点击编辑按钮,进入编辑页面。这个时候,编辑页面应该怎么表现呢。
1,光标停留在输入框(input或textarea)中,并在输入框value的末尾。
2,弹出键盘。

先说第一个问题的解决,读别人的博客,然后跟着做。然后看效果。关于这个问题的相关博客。
http://www.zhangxinxu.com/wordpress/2010/04/%E6%96%B0%E6%B5%AA%E5%BE%AE%E5%8D%9A%E6%8F%92%E5%85%A5%E8%AF%9D%E9%A2%98%E5%90%8E%E9%83%A8%E5%88%86%E6%96%87%E5%AD%97%E9%80%89%E4%B8%AD%E7%9A%84js%E5%AE%9E%E7%8E%B0/
http://www.jb51.net/article/26527.htm

在看第二个问题。
http://ask.dcloud.net.cn/article/513
参考文章中用的是input,用textArea也可以的。我测试的是ios机器。android机器没测试。想应该也是可以的。也许会出现一些bug。比如弹出键盘后,会马上消失不见。感觉文章中所说方案不怎么靠谱,因为不是百分百能弹出键盘。多次试验,将setTimeout的时间设置长一点,会好很多。

6月 122016
 

断断续续的写了好几篇。到现在,还没写成一连串的完整APP的创建过程。这中间,也听说了一些其他框架,比如apicloud , framework7,sui等。太多框架,众说纷纭。有时候,也难以让人抉择。不过,自己先接触的mui框架,也看了下其他框架。表面看了下,都能实现ui这些功能。既然,mui已经有一定基础了,且能做出东西了,就还是用mui吧。

现在回归正题。app页面的基本组成。app页面一般有页头,页身,页底组成。页头和页底一般都由导航nav(也可以叫菜单menu)组成。再啰嗦一点,页头的导航一般是滑块slider导航。是输入该页面的。而页底的导航是输入很多页面的,也就是很多页面都会存在底部的导航。 如下图所示:

Continue reading »

5月 302016
 

对于app的页面,起初,我们可以虚拟一些数据。但不能总是做静态的网页。这个时候,需要去请求一些数据。而我们是用pc来开发的,pc上搭建了php环境。所以,这个时候就遇到了手机访问本地localhost的问题。官网给了一篇调试PHP的文章,http://ask.dcloud.net.cn/article/144。自己没跑通,也没理解怎么用。于是,再去想别的办法。方法,可能有很多种,我自己跑通,有始有终的有一种,那就是借助Fiddler。

场景环境:
1,手机连的是wifi。
2,pc连的是宽带。pc上已经安装了Fiddler。
Continue reading »

5月 272016
 

h5+app,抛开大的方面,比如结构,功能这些。h5+app,其实主要是html + js + css。这里说主要,那另外的就是ajax,native.js等这些了。而mui框架,帮我们封装实现了一个一个比较实用的组件。比如:图片轮播,图文列表,侧滑菜单,折叠面板等。我们只需要按照规范,引用class就可以了。也可以在此基础上修改。那如果,不用这些呢。用js,css自己写呢。这个当然是可以的。可是,在时间如此珍贵的时代,你还愿意花更多的时间来写吗。即使自己写,写出来的效果能有mui封装的好吗。如果,虽然。如果你时间足够多,当然是可以花些时间去研究js,css。而不必直接就开始用jquery,mui这些。好吧,想要快速的实现效果,我们还是能用,恰到好处的用mui框架里的组件吧。

第三方的框架还是很多的。http://amazeui.org/widgets/slider# 还有jscroll等。时间不多,不能每个项目都要去造轮子。

mui的使用文档:
1,老版本。http://dcloudio.github.io/mui/javascript/
2,新版本。http://dev.dcloud.net.cn/mui/ui/
某些组件,老版本讲的比较详细。

最常用,最实在的几个组件,这里重复一下,自己也跟着学习,加深下印象。

1,轮播图片。http://dev.dcloud.net.cn/mui/ui/#gallery 这里讲的通俗易懂。一看就晓得怎么用了。

5月 262016
 

用框架做事情,很容易就不自觉走进坑中。如何面对以及处理这些坑,是个路漫漫其修远兮的过程。需要去尝试和记录。还有,怎么去描述这些坑,专业术语怎么表达,这个是重点。毕竟,很多时候,需要去问度娘等。如果都不知道怎么描述,怎么找答案呢。下边一点一点的总结我所遇到的问题。这些问题导致体验不完美或出故障。

1,冥冥代码是对的。图片就是不显示或代码根本就不是按代码所要展示的效果走。HBuilder中,有一个功能,为了使得打的包足够小,会对资源关系进行优化。因为在你的项目中,可能存在的图片或js或xml等不是项目最终需要的。这个时候,你通过优化功能去掉了页面的引用关系。后来你改代码了,引用了原来图片或资源。这个时候你觉得是对的,路劲写的也没错,为什么就没效果呢。这个时候,你就需要重新构建引用关系。并在代码视图中的unpackage包中,去掉之前删除过的引用。最后这一句很重要。

2,页面左右策划的时候,冥冥不想划出可视区域。划出可视局域后,有一块白屏。却偏偏划出去白屏了。这个时候,是设置侧滑返回关闭窗口了的功能。只需要将其设置为none即可。就是popGesture这个参数。至少我是这样的。

3,页面滑动后出现下沉的现象。创建webview的时候,你可以设置webview距离顶部或底部的距离。当你设置了到顶部有一定距离后,show出来的时候就会出现下沉。敲这篇文字的时候,我也在想解决这个问题。得去弄懂设置了顶部距离后,究竟做了什么。比如设置了页面的浮动top或padding什么的。

网站地图