当前位置: 首页 > 编程日记 > 正文

【一步步学小程序】1.创建项目以及TabBar

1.创建项目

如图,创建项目,输入项目名称、选择目录,AppID是唯一标识,我们可以先点如图红框内的测试号,自动生成一个AppID,然后点新建即创建完一个新项目。
在这里插入图片描述

2.创建3个页面

确保如图左上角的编译器按钮是选中状态,此时我们就可以看到项目的文件结构和编译器
在这里插入图片描述
打开app.json文件。所有页面都需要在此json中的pages标签下进行声明。我们看到开发工具已经帮我们创建了两个页面index和logs,但是我们不需要,可以先忽略,在pages中,声明3个新页面:

  • 首页:pages/home/homeMain/homeMain
  • 问答:pages/question/questionMain/questionMain
  • 我的:pages/my/myMain/myMain
    在这里插入图片描述
    通过Command+S (WIndows下是Cotrol+S)保存后,此时再看下目录结构,发现pages目录下多了3个文件夹,正是对应上面3个页面。
    在这里插入图片描述
    我们暂时先不讨论目录中包含的文件。

3.创建Tabbar

上一步已经创建了3个页面,我们创建一个包含这三个页面的tabbar。还是在app.json文件中的pages标签之后,添加如下代码

"tabBar": {"color": "#646565","selectedColor": "#F55D54","borderStyle": "black","list": [{"selectedIconPath": "images/tab/home_selected.png","iconPath": "images/tab/home_unselected.png","pagePath": "pages/home/homeMain/homeMain","text": "首页"},{"selectedIconPath": "images/tab/message_selected.png","iconPath": "images/tab/message_unselected.png","pagePath": "pages/question/questionMain/questionMain","text": "问答"},{"selectedIconPath": "images/tab/me_selected.png","iconPath": "images/tab/me_unselected.png","pagePath": "pages/my/myMain/myMain","text": "我的"}]},

此时app.json文件结构如图:
在这里插入图片描述
各个字段的作用如下:

  • color:tabItem未被选中时的颜色
  • selectedColor:tabItem被选中时的颜色
  • borderStyle:tabbar上面的分割线颜色
  • list:所包含的tabItem的列表
  • selectedIconPath:tabItem被选中时的图片
  • iconPath:tabItem未选中时的图片
  • pagePath:tab对应的页面路径(即上一步创建在pages中添加的页面路径)
  • text:tabItem对应文字

保存app.json文件,此时模拟器中显示的内容如下图,虽然一行代码没写,但是已经创建好tabbar,并可以在多个tab中切换了,下一节,将介绍如果编写页面内容。

在这里插入图片描述

相关文章:

Yii在window下的安装方法

首先,在http://www.yiichina.com/上下载yii 然后,配置系统环境变量,在win8下,按winx,找到系统->高级系统设置->环境变量->path 把php的运行环境,加入到环境变量中,以分号隔开。如&…

从新手到入门,如何进入协议分析的世界

“ 协议分析与还原自学及入门指南。”有部分朋友给我发消息,说对协议还原很感兴趣,但苦于没人指导,希望得到我的帮助,问我如何进行协议分析的学习。这篇文章从初学者的角度,编列了一个学习指南,希望能对协议…

C# 学习笔记01

想写一个app可以访问数据库,实现对数据库的查询,修改等,突然发现知识实在有限,故选择C#来实现此app。 使用简单的三层架构来作为此app的架构。表现层(UI)、业务逻辑层(BLL)、数据访问…

转载 iOS js oc相互调用(JavaScriptCore) --iOS调用js

iOS js oc相互调用(JavaScriptCore) 从iOS7开始 苹果公布了JavaScriptCore.framework 它使得JS与OC的交互更加方便了。 下面我们就简单了解一下这个框架 首先我导入framework 方法如下 点击Linked Frameworks and Libraries 的添加后 选择 JavaScriptCor…

【一步步学小程序】2.列表展示

我们上一节已经创建了一个可以点击切换的tabbar。这节我们开始正式敲代码,在首页上展示一个可以上下滚动的课程列表: 首先打开上一节的pages/home/homeMain/homeMain.wxml文件,布局相关代码都会在此文件中,小程序的布局方式类似H…

git分支的合并

原文: http://gitbook.liuhui998.com/3_3.html http://gitbook.liuhui998.com/5_3.html 一、如何分支的合并在git中,可以使用git merge 和git rebase两个命令来进行分支的合并。git merge 和git rebase在大体上都差不多,下文主要以git merg…

【一步步学小程序】3. 使用自定义组件(component)

上一节创建了一个包含多个课程数据的列表。这一节我们用自定义组件(component),来优化列表页面,即如图,我们把每个课程单元格封装为组件。 使用组件的好处: 自定义组件可以在不同的页面中重复使用将复杂…

《lua程序设计(第二版)》学习笔记(五)-- 函数基础

-- 第 5 章 函数-- 一种对语句和表达式进行抽象的主要机制 print(os.date()); -- 打印日期 Sun Apr 20 12:44:46 2014 -- 一看到sun,感慨广州没有晴天 -- 函数没有参数也要括号 -- 特殊情况:只有一个参数的时候, 并且参数一个string/table构造…

HTTP协议中的chunked编码解析

“ HTTP协议中的chunked传输编码全接触。”在HTTP协议中,服务器发往客户端的数据中,通常都包括HTTP头和HTTP体,当存在HTTP体的时候,HTTP体的长度通常是由HTTP头内的“Content-Length”字段确定。就像下图:不过&#xf…

html-css实例

<!DOCTYPE html> <html><head><meta charset"utf-8" /><title>求签</title><style type"text/css">*{margin: 0px;padding: 0px;font-family: "微软雅黑",arial,sans-serif;}body{background: url(im…

【Swift】变量/常量/类型总结

1、变量&#xff08;Variable&#xff09; 变量&#xff0c;可以理解为存放某一类型的值的容器&#xff0c;如&#xff1a; var count:Int var shouldRemind:BOOL var text:String var list:[ChecklistItem]一个变量的数据类型&#xff0c;决定了它能存放什么类型的数据。有些…

ODBC更新记录集提示”记录集为只读“

创建的ODBC应用程序默认的记录集不具有只读属性&#xff0c;但是再更新记录表时会提示”记录集为只读“&#xff0c;这是为什么呢&#xff1f; 今天看书找到了答案&#xff1a; 因为MFC中的数据库类不支持需要连接两个或者多个表的记录集更新&#xff0c;如果选择数据源的时候选…

gzip格式分析与识别

“ 介绍gzip格式&#xff0c;识别gzip压缩的数据流量。”在协议分析过程中&#xff0c;经常会发现gzip压缩的数据&#xff0c;例如在HTTP协议中&#xff0c;在HTTP头中会标示&#xff0c;内容编码为gzip、DEFLATE。但是&#xff0c;还有很多情况&#xff0c;例如一些非HTTP协议…

CSS 和 JS 动画哪个更快

基于Javascript的动画暗中同CSS过渡效果一样&#xff0c;甚至更加快&#xff0c;这怎么可能呢&#xff1f;而Adobe和Google持续发布的富媒体移动网站的性能可媲美本地应用&#xff0c;这又怎么可能呢&#xff1f; 本文逐一遍览了基于Javascript的DOM动画库&#xff0c;如Veloci…

C语言之分支结构 if(一)

一 程序的三种基本结构 顺序结构&#xff1a;程序从上往下依次执行&#xff0c;这个叫顺序结构 分支结构&#xff1a;有选择的执行或者不执行某段代码 循环结构&#xff1a;重复的执行某段代码 二 分支结构之if 最简单的俩种用法 (tips: if语句后面的大括号可以省略&#xff1a…

react-native安装Ant Design

1.集成Ant Design到项目 项目根目录中执行命令&#xff1a; npm install ant-design/react-native --save2.集成按需加载babel-plugin-import到项目 项目根目录中执行命令&#xff1a; npm install --save-dev babel-plugin-import3.创建.babelrc文件 根目录中创建新文件…

车联网APP,安全设施薄弱的山寨品

“ 目前的车联网APP&#xff0c;几乎没有安全性可言。”在网络上闲逛&#xff0c;一不小心&#xff0c;逛进了车联网的领地。物联网、车联网、IoT如火如荼&#xff0c;各个大佬、院士加持&#xff0c;看着相当的高大上。但是&#xff0c;在伟岸的外表下&#xff0c;到底真实的情…

CSS里总算是有了一种简单的垂直居中布局的方法了

<!DOCTYPE html> <html xmlns"http://www.w3.org/1999/xhtml"> <head><meta http-equiv"Content-Type" content"text/html; charsetutf-8"/><title>无标题文档</title><style type"text/css"&…

【星榜单】盘点那些坑爹的国产手机们

【星榜单】盘点那些坑爹的国产手机们 国产手机的那些坑爹事儿很多&#xff0c;中庸到基本大众脸的设计还算是有点良心的&#xff0c;那些奇葩的名字、所谓的高配低价低却又山寨级的做工、饥饿营销让你看得到买不到、伪小清新却又华而不实放眼过去的国产智能手机比比皆是&#x…

App Tracking Transparency被拒解决

App Tracking Transparency 如果使用了App Tracking Transparency&#xff0c;苹果要求在iOS 14.5及以上的版本中必须在弹框取得用户同意后&#xff0c;才可以跟踪用户。否则会被拒&#xff1a; 解决方案 参照官方文档说明&#xff08;https://developer.apple.com/documen…

ProtoBuf格式详解

“介绍protobuf编码格式。”protobuf是一种数据交换格式&#xff0c;又称PB编码&#xff0c;由Google开源&#xff0c;类似于Json、XML&#xff0c;但其内部是纯二进制格式&#xff0c;比Json&#xff0c;XML等格式要更精炼&#xff0c;主要用于数据的序列化和反序列化&#xf…

Android studio 第二次作业

作业要求&#xff1a; 作一个显示框里面分成三行 一二行占这个框的1/2 第三行独占1/2 第三行里面分成两列第一列占25%&#xff0c;第二列占75%。 屏幕显示效果 实现步骤&#xff1a; <LinearLayout android:orientation"vertical"注意这里是横向布局 …

Cable master (POJ No.1064)

二分搜索思想&#xff1a;bool C(double x)可以得到长度为x的绳子//#define LOCAL #include<stdio.h> #include<math.h> int const MAX_N10005; int const MAX_M100; double const INF100000000; int N,K; double d[MAX_N],lb,ub; //判断是否满足条件 bool C(doubl…

iOS 11 导致tableview 刷新之后漂移问题

在10 系好好的&#xff0c;在11系统刷新只有就会多一个白块。查询才返现&#xff0c;添加一下代码 完美解决此bugself.mainTableView.estimatedRowHeight 0; self.mainTableView.estimatedSectionHeaderHeight 0; self.mainTableView.estimatedSectionFooterHeight 0;

HTTP协议解析之Cookie

“ Cookie与身份认证。”提到HTTP协议&#xff0c;不可避免地都会牵涉到Cookie&#xff0c;可以说&#xff0c;Cookie作为HTTP的重要组成部分&#xff0c;促进了HTTP协议的发展壮大。HTTP协议如果没有了Cookie&#xff0c;将会是一个无状态&#xff0c;无法便捷地进行用户识别的…

libevent源码深度剖析十一

libevent源码深度剖析十一 ——时间管理 张亮 为了支持定时器&#xff0c;Libevent必须和系统时间打交道&#xff0c;这一部分的内容也比较简单&#xff0c;主要涉及到时间的加减辅助函数、时间缓存、时间校正和定时器堆的时间值调整等。下面就结合源代码来分析一下。 1 初始化…

CentOS 安装Apache

# centOS 安装A M P 环境[参考简书作者,非常感谢&#xff01;&#xff01;&#xff01;](https://www.jianshu.com/p/bc14ff0ab1c7) ## 一 Apache 环境安装 1 安装Apache > yum install httpd2 操作指令一览 > systemctl start httpd //启动apache > systemct…

使用admin lte 碰到访问Google字体的问题

下载了admin lte 的模板&#xff0c;运行的时候&#xff0c;发现很慢&#xff0c;看了一下console,发现adminlte.css里有import google的字体文件&#xff0c;众所周知的原因&#xff0c;无法访问&#xff0c;所以网页很慢&#xff0c;没办法&#xff0c;只能下载到本地了,cnbl…

如何突破DNS报文的512字节限制

“DNS协议大家都应该很熟悉&#xff0c;最近有同学问到如何获得UDP承载的超过512字节的DNS报文&#xff0c;借此机会&#xff0c;我们一起了解下DNS协议与报文长度有关的一些细节。”本文将讨论的是DNS协议在UDP承载时超过512字节的这一细节。在之前的文章里&#xff0c;对DNS协…

Fragment为什么须要无参构造方法

日前在项目代码里遇到偷懒使用重写Fragment带参构造方法来传参的做法&#xff0c;顿生好奇&#xff0c;继承android.support.v4.app.Fragment而又不写无参构造方法不是会出现lint错误编译不通过的咩&#xff1f;仔细追究&#xff0c;原来是这货被加了SuppressLint("ValidF…