apicloud中的常用的小知识点

最新推荐文章于 2022-05-05 11:21:01 发布
最新推荐文章于 2022-05-05 11:21:01 发布
阅读量888 收藏 3
点赞数 3
分类专栏： css html apicloud
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_33323469/article/details/86537597
版权
html 同时被 3 个专栏收录
19 篇文章 0 订阅
订阅专栏
css
16 篇文章 0 订阅
订阅专栏
apicloud
8 篇文章 0 订阅
订阅专栏

1.确认框

    api.confirm({
                    title: '退出',
                    msg: '点击确定退出程序',
                    buttons:['确定', '取消']
                },function(ret,err){
                    if(ret.buttonIndex == 1){
                       alert('sd')
                    }
                });

2.toast弹窗

 api.toast({
     msg: '网络错误',
     duration: 3000,
     location: 'bottom'
 });

3.加载框

  api.showProgress({
                            style: 'default',
                            title: '正在上传中...',
                            text: 10+ '%',
                            modal: true
                        });
 加载完成掉用关闭
 api.hideProgress();

4.缓存读取设置清除

$api.setStorage('name','key');//设置
$api.getStorage('name');//获得指定name的值
$api.rmStorage('name');//清除指定name的值
$api.clearStorage();//清楚全部本地数据

5.头部自动适应手机的状态栏 不挡住状态栏

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的列表</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <style>
        html,
        body {
            width: 100%;
            font-family: PingFang-SC-Medium;
        }
        .topbar {
            width: 100%;
            height: 45px;
            background: #f8f8f8;
            border-bottom: 1px solid #e4e4e4 !important;
            overflow: hidden;
        }
        .topbar .box1 {
            width: 15%;
            height: 45px;
            float: left;
        }
        .topbar .box1 .back {
            width: 11px;
            height: 20px;
            margin-top: 13px;
            margin-left: 17px;
        }
        .topbar .box1 .back img {
            width: 100%;
            height: 100%;
        }
        .topbar .box2 {
            width: 70%;
            height: 45px;
            float: left;
        }
        .topbar .box2 p{
          text-align: center;
          line-height: 45px;
          font-size: 17px;
          color: #000000;
          font-weight: bold;
        }
        .topbar .box3 {
            width: 15%;
            height: 45px;
            float: left;
        }
        .topbar .box3  .serch{
          width: 20px;
          height: 15px;
          margin-top: 17px;
          margin-left: 6px;
        }
        .topbar .box3  .serch img{
          width: 100%;
          height: 100%;
        }
    </style>
</head>
<body>
        <div class="topbar" id='titlebox'>
            <div class="box1">
                <div class="back" onclick="closeWin()">
                    <img src="../../image/courseback.png" alt="">
                </div>
            </div>
            <div class="box2" >
                <p id='name'>我的列表</p>
            </div>
            <div class="box3">
              <div class="serch" onclick="serchinfo()"></div>
            </div>
        </div>
    <script type="text/javascript" src="../../script/api.js"></script>
    <script type="text/javascript" src="../../script/apiCloud.js"></script>
    <script>
        apiready = function() {
        //主要代码
            var header = document.getElementById('titlebox');
            $api.fixStatusBar(header);            
        }
    </script>
</body>
</html>

6.app一般页面一般有个头部页面和下面的内容页面，建议写在两个页面，
比如index.html页面 如果头部页面和内容页面全部写在一个页面，当内容大于手机屏幕，向上滚动就会压住手机状态栏，
所以建议头部内容写在两个页面 结构index.html是头部index_body.html是内容页面
让打开index.html的时候自动加载下面的Frame index_body.html页面
index_body.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <style>
        html,
        body {
            width: 100%;
            font-family: PingFang-SC-Medium;
        }
        .topbar {
            width: 100%;
            height: 45px;
            background: #f8f8f8;
            border-bottom: 1px solid #e4e4e4 !important;
            overflow: hidden;
        }
     
    </style>
</head>
<body>
        <div class="topbar" id='titlebox'>
            里面写标题和返回按钮样式根据要求自定义
        </div>
    <script type="text/javascript" src="../../script/api.js"></script>
    <script type="text/javascript" src="../../script/apiCloud.js"></script>
    <script>
        apiready = function() {
        // 适配状态栏
            var header = document.getElementById('titlebox');
            $api.fixStatusBar(header);
             var parms = api.pageParam;
            //自动加载内容页面
            api.openFrame({
                name: 'index_body',
                url: './index_body.html',
                rect: {
                  x: 0,
                  y: api.safeArea.top+46, //后面的数字可以自己调整 就是头部导航的高度 往上走1-//2个像素
                  w: 'auto',
                  h: 'auto'
                },
            });
        }
    </script>
</body>
</html>

index_body.html页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <style>
     
    </style>
</head>
<body>
        <div>
            <ul>
				<li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>
				<li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>
				<li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>
				<li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>
				<li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>
				 <li>111111</li>    <li>111111</li>    <li>111111</li>    <li>111111</li>         <li>333333</li>
          </ul>
        </div>
    <script type="text/javascript" src="../../script/api.js"></script>
    <script type="text/javascript" src="../../script/apiCloud.js"></script>
    <script>
        apiready = function() {
      
        }
    </script>
</body>
</html>

当内容页面超过手机屏幕的时候，下面的内容只会往标题下面往上移动
如图

在这里插入图片描述

1登峰造极
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
【无标题】Android studio中提示框“确定”和“取消”按钮的编写
weixin_45528615的博客
02-02 4726
Android studio中提示框“确定”和“取消”按钮的编写1、写在前面的话2、目标任务3、实现过程3.1布局文件的编写3.1编写对话框4、总结 1、写在前面的话 本人40岁纯小白一枚，最近对Android APP有了兴趣，目前的任务：通过Android Studio 利用Apche poi 、EasyExcel等第三方库，编写APP，实现移动端APP 与后台Excel的数据交互。 这次利用CSDN平台记录下自己的成长。 纯属小白，有概念或者描述错误，希望大佬们不吝赐教，再此谢过。 2、目标任务 在学
apicloud模块开发知识点
weixin_30807779的博客
06-25 98
1. 没有加模块的时候dex里面的包 \android\support\annotation \android\support\v4 \com\uzmap\pkg \compile 2. 不能混淆的类： 在AndroidManifest.xml定义的类 在apicloud模块里定义的类 R类 annotation类 native方法 3. 各个模块之间的资源是串起来...
APICloud学习笔记之Click事件优化
weixin_30314793的博客
03-21 200
1.H5元素 <div class="content" tapmode onclick="fnOpenWareWin('{{=value.id}}');"> 2.调用，元素加载完毕后调用 api.parseTapmode(); 转载于:https://www.cnblogs.com/wuhailong/p/6595830.html...
apicloud应用笔记（二）
David-Yao的专栏
09-27 1398
一些常用api showProgress api.showProgress api.hideProgress();
弹出框一 之 基于bootstrap和jquery的自定义弹出框
dgnwy6921的博客
03-27 236
(function ($) { window.Ewin = function () { var html = '<div id="[Id]" class="modal fade" role="dialog" aria-labelledby="modalLabel">' + '<div class...
小谈APICloud中的pointer和relation
07-16
在 APICloud 开发过程中，数据库管理是至关重要的，尤其是涉及到不同表之间的数据关联。本文主要探讨了 APICloud 中的两种数据关联方式：pointer 和 relation，这两种方式都是在 NoSQL 数据库中实现表间关联的关键。...
apicloud拉起小程序并传递参数的方法示例
10-17
主要介绍了apicloud拉起小程序并传递参数的方法示例,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
APICloud小白入门.zip
09-28
在"APICloud小白入门"的学习过程中，你不仅会接触到移动开发的基础知识，还会了解到一个完整的APP从无到有、从开发到上线的全貌。通过这个教程，你可以逐步建立起自己的移动开发技能，为未来的项目打下坚实的基础。...
apicloud中vue处理购物车全选单选
01-15
使用vue在apicloud实现 购物车的全选单选 只要是拿一个字段作区分 那他去作区分 最麻烦的就是ios不能全选 但是我是经过api.systemType 做过处理 ios和安卓的区分 <input class="aui-radio" v-model="vo.is_...
APICloud之常用的API方法
吴小花的博客
02-25 2025
1.openWin api.openWin({ name: 'page1', url: './page1.html', pageParam: { name: 'test' } }); 2.closeWin //关闭当前window，使用默认动画 api.closeWin(); //关闭指定window，若待关闭的window不在最上面，则...
APICloud介绍
热门推荐
u010035154的专栏
12-09 3万+
在APICloud创建了应用之后，应用的包结构如下图所示： 其中“config.xml”和 “index.html” 必须包含，其它均为可选。“config.xml”是配置文件，“index.html”是启动页面，“icon”为图标文件目录，“launch”为启动图片目录 actionSheet底部弹出框：api.actionSheet({ title: '底部弹出框测试'
使用API进行销售订单的Pick Release和Pick Confirm
chosen1brain的专栏
06-18 2786
DECLARE x_return_status VARCHAR2(2); x_msg_count NUMBER; x_msg_data VARCHAR2(2000); p_api_version_number NUMBER := 1.0; init_msg_list VARCHAR2(200); x_msg_d
APICloud 的一些常用方法
love_pgme的博客
10-11 7965
工作要求用APICloud混合开发APP，了解过后发现这中开发方式十分强大，于是从网上开始了学习
ApiCloud的各种方法集合
小屁孩大帅-保密的博客
07-05 3319
在APICloud创建了应用之后，应用的包结构如下图所示：其中“config.xml”和 “index.html” 必须包含，其它均为可选。“config.xml”是配置文件，“index.html”是启动页面，“icon”为图标文件目录，“launch”为启动图片目录actionSheet底部弹出框：api.actionSheet({ title: '底部弹出框测试', cancel...
ProgressDialog的hide()和dismiss()方法
u014302433的专栏
01-19 7400
在使用ProgressDialog作为网络加载数据的请求过程中，当数据加载完成，笔者很自然的将ProgressDialog调用了hide()方法，在当前activity退出时，遇到问题了android.view.WindowLeaked: Activity com.xxx.xxx.hangup.ProgressDialogActivity has leaked window com.android.
APICloud 获取服务器数据的两种方法（自己的服务器和APICloud 的云服务器）
qq_35445741的博客
04-08 3649
一、通过api.ajax异步请求取个人服务器数据 apiready = function(){ api.ajax({ url: 'http://119.29.157.60/api/Shop/getAll', // 自己用PHP写的请求数据库的接口 method: 'get', headers:{ 'Content-Type': 'appli...
APICloud App开发上手经验分享之模块调用
qq_39638013的博客
05-05 504
继上次简单分享了使用APICloud开发APP的全流程后，今天来分享一下如何使用模块。APICloud提供了很多方便好用的模块，只要学习自己想要使用的模块的文档，然后调用模块就可以使用了。使用模块可以大大减少自己需要写的代码量，而且对于新手来说，在自己开发经验不足的情况下，也许并不能胜任一些功能的开发，这时候使用模块就可以让自己的APP也拥有这些功能了，看到自己的APP也具有了丰富的功能会比较有成就感，不会使我们的学习感到枯燥，也不容易感觉学习太难而因此止步。 这篇文章使用了一个简单的免费模块Pers
ApiCloud开发经验总结
fzddd7315的博客
05-02 1万+
1. 引擎或模块问题：遇到应用层无法解决的问题，如果能确定需要引擎和模块支持的，不要自己想办法绕过去，要第一时间在开发者社区提交问题，或找APICloud项目经理提出。 !!!注意!!!: 在开发者社区中，会有版主和APICloud技术支持对您的问题进行验证和解答。 !!!注意!!!: 定制平台项目问题提出后2天之内没有解决的，可以直接找APICloud项目总监投诉。
apicloud跳转微信小程序
最新发布
05-25
要在 Apicloud 中跳转到微信小程序，可以使用 apicloud-to-wechat-miniprogram 插件。下面是具体步骤： 1. 安装插件 在 Apicloud 控制台中，找到您的项目，进入“插件管理”页面，搜索并安装“apicloud-to-wechat-miniprogram”插件。 2. 引入插件 在您的页面中，引入 apicloud-to-wechat-miniprogram 插件，可以使用以下代码： ```javascript var wxMiniProgram = api.require('wxMiniProgram'); ``` 3. 跳转到微信小程序 在需要跳转到微信小程序的事件处理程序中，调用 wxMiniProgram 的 open 方法，传入小程序的 AppID 和路径。例如： ```javascript wxMiniProgram.open({ appId: 'wx1234567890', path: '/pages/index' }, function(ret, err) { if (ret.status) { // 跳转成功 } else { // 跳转失败 } }); ``` 通过以上步骤，您就可以在 Apicloud 中跳转到微信小程序了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

1登峰造极

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值