前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >初试小刀自我简历小程序

初试小刀自我简历小程序

作者头像
张炳
发布2019-08-05 15:26:05
1.1K0
发布2019-08-05 15:26:05
举报

最近在做小程序,和域名更换,和新域名备案事情,甚是较忙,少写了文章,今天尝试写一篇小白总结小程序的常见问题,刚接触小程序不到2周,在业余时间尝试小刀小程序,在做这个简历之前,自己亲身搜索了个人简历的小程序,都体验过,大部分是参差不齐,我这个算是比较用心的制作了,搜索出来的简历小程序要不就是其他第三方支持自动生成的,或者是自己制作的,但是都是放置一个设计的图,比较简单,但是也不缺一些好的案例。

附上个人简历小程序图,做得怎么样,大家可以微信扫描体验下,多指教下。

小程序开发资源汇总

https://github.com/justjavac/...

小程序开发框架

在github里面找了找,Wepy 和mpvue比较火,毕竟Wepy是腾讯官方的开源,故我选择了Wepy。同时也选择了weui库,貌似zanui也不错,大家可以尝试下。

幻灯片组件

看到别人的一些小程序幻灯片图片转转转,很酷,以为是一些其他框架带来的,其实 官方自带了视图容器swiper,详情点击官方 https://developers.weixin.qq....

下方的tabBar

刚开始做的时候,以为这些都是必须写成组件,封装成UI输出,其实原生小程序已经自带了,不需要额外做,在app.json可以设置,在wepy框架是 app.wpy里面设置。

矢量图标哪里找

在这 http://www.iconfont.cn/ 可以找到需要的icon。

界面样式如何适应不同手机

毕竟是在微信内部小程序环境,如何适应不同手机是个问题,用rpx吧,这样在不同的手机可以实现自适应。所以如果你使用的模块有pxh或者rem,换算方式为:1px=2rpx,1rem=35rpx。

内嵌html页面

当初在做的时候也想过类似问题,其实百度了下,得知了答案,只有公司类型账号才能内置 网页<web-view src="https://www.xxxxxxxxx.com/ind...; />,个人账号类型不可以哟!

在html5跳转到小程序的一个页面

代码语言:javascript
复制
<!-- html代码中引入JS SDK --> 
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script> 
<script> 
 wx.miniProgram.navigateTo({url: '/path/to/page'}) 
</script>

实现锚点跳转

下面是我用wepy实现的代码(自己看重点),其实就是用了官方视图容器scroll-view

代码语言:javascript
复制
<template>

    <scroll-view scroll-y="true"  scroll-into-view="{{toView}}" scroll-with-animation="true"  class="out_scroll_view">
        <view id="list0"> </view>
        <view id="list1"> </view>
        <view id="list2"> </view>
        <view id="list3"> </view>
        <view id="list4"> </view>
        <footer></footer>
    </scroll-view>      

    <view class='right_nav'>
        <view class='nav_item' wx:for="{{rightNav}}" @tap="jumpTo(list{{index}})">
         <text class='item_name'>{{item}}</text>
        </view>
    </view>

</template>


<script>
    import wepy from 'wepy';
    import Footer from './common/footer';


    export default class Panel extends wepy.page {

        data = {
            rightNav:['厂家网','腾讯','满天星','嵊灿','诺沃帝'],
            toView:''
        };

        components = {
            footer: Footer
        };

        methods = {

        };

        jumpTo(e){
            this.toView = e.currentTarget.dataset.wpyjumptoA;
        };    

        async onLoad () {
            wx.showShareMenu({
                withShareTicket: true
            });       
        };
    }
</script>

设置COOKIE

https://blog.csdn.net/DylanCa...

转发功能

我记得官方有接口,可以设置展示转发按钮,或者你自身页面的UI,都可以触发转发功能,懒得找出来了,有心的自行到官方一看接口很容易找打送。 more detail look this https://blog.csdn.net/rolan19...

设置启动页面

看①https://blog.csdn.net/kerryqp...

看②https://blog.csdn.net/u012987...

有趣功能接口

小程序之间互跳转,拨打电话,震动电话,添加联系人,调整屏幕亮度,退出小程序,复制功能,转发功能等原生功能,都是官方有接口的,都挺有意思,大家可以进行体会。

预览图片

https://blog.csdn.net/gao_xu_...,这功能是官方封装好,挺实用。

审核上线提交

官方文章还有有必要读下的 微信小程序平台运营规范,微信小程序平台常见拒绝情形

遗留问题和总结

在swiper里面的图片,图片大小样式,不要给固定值,给width:100%,和height:100%,要不会出现在不同手机设备不兼容,我自身测试过;还有个问题可以分享,在工作经历tab里面, 顶部有个图片已经相对定位放在头部,然后我加了css3动画文字,整个文字块尝试过绝对定位和相对定位进行偏移到图片(图片里面的电脑屏幕上)上,自身在我安卓华为手机是可以看到动画效果的,但是在IOS手机,就是不出现,只好无奈,重新P下图片,把文字P上去; 在基本信息tab里面,有个“退出小程序”按钮功能,在IOS上,反应不是很灵敏,感觉功能不行,不知道其他开发者会不会遇到这样的问题,安卓上是可以的。

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 小程序开发资源汇总
  • 小程序开发框架
  • 幻灯片组件
  • 下方的tabBar
  • 矢量图标哪里找
  • 界面样式如何适应不同手机
  • 内嵌html页面
  • 实现锚点跳转
  • 设置COOKIE
  • 转发功能
  • 设置启动页面
  • 有趣功能接口
  • 预览图片
  • 审核上线提交
  • 遗留问题和总结
相关产品与服务
云开发 CloudBase
云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档