脚本宝典收集整理的这篇文章主要介绍了01--微信小程序介绍，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

day01 微信小程序

1. 问题

• 什么是微信小程序？

  - 移动互联网时代，手机。 
  - 手机软件，在手机上中安装很多软件。
  - 腾讯和阿里（只安装自己不用别人）
    - 腾讯：微信 + N小程序
    - 阿里：支付宝 + N小程序
  

• 为什么要做小程序？

  微信用户基数大。
  在微信上用我们小程序会比较便捷。
  

• 如何开发小程序？

  

  • 小程序：学习微信开发的语言（前端htML、css、js、vue.js）
    • 微信开发者工具
  • API：restful接口（Python+django+drf框架）。
    • Pycharm

2.环境的搭建

2.1 Python环境

• 虚拟环境
  • django
  • drf
• pycharm

2.2 小程序环境

2.2.1 申请一个微信公众平台

2.2.2 保存自己的appid

appid = wx1a3fac0e7easDFffs

2.2.3 下载开发者工具

2.2.4 创建项目

3.开发小程序

3.1 全局配置

{
  "pages": [     // 页面配置
    "pages/index/index",
    "pages/home/home"
  ],
      
  "window": {
    "navigationBarBackgroundColor": "#FFDAB9",  // 小程序标题背景色 只支持16进制 
    "navigationBarTextStyle": "black",  // 小程序标题颜色
    "navigationBarTITleText": "李业"  // 小程序标题
  },
      
  "tabBar": {     // 底部菜单页面配置
    "selectedColor":"#CD5C5C",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页",
        "iconPath": "static/tabbar/ic_menu_choice_nor.png",
        "selectedIconPath": "static/tabbar/ic_menu_choice_Pressed.png"
      },
      {
        "pagePath": "pages/home/home",
        "text": "我的",
        "iconPath": "static/tabbar/ic_menu_me_nor.png",
        "selectedIconPath": "static/tabbar/ic_menu_me_PRessed.png"
      }
    ]
  }
}

3.2 组件(标签)

# text标签
  编写文本信息，类似于span标签

#  view标签
  容器，类似于div标签

# image标签
  图片

3.3 样式

3.3.1 像素

px
 
rpx，750rpx

# 小程序中：
  建议使用rpx像素，是相对像素，会根据页面宽度自动跳转像素，
  手机默认宽度是750rpx

4.flex布局

一种非常方便的布局方式。(弹性盒子)

在容器中记住4个样式即可。

display: flex;   		# flex布局
    
flex-direction: row;	# 规定主轴的方向：row/column
    
justify-content: space-around;  # 元素在主轴方向上的排列方式
    flex-start
    flex-end
    space-around
    space-between		
    
align-items: center;  # 元素在副轴方向上的排列方式
    flex-start
    flex-end
    space-around
    space-between	

脚本宝典总结

以上是脚本宝典为你收集整理的01--微信小程序介绍全部内容，希望文章能够帮你解决01--微信小程序介绍所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。