用户2957671
用户2957671
  • 发布:2025-12-31 13:56
  • 更新:2025-12-31 13:56
  • 阅读:11

新手

分类:HBuilderX

1.在pages.json里写(10分)
"tabBar": {
"selectedColor": "#ff0000",
"color": "#8f8f94",
"list": [
{
"iconPath": "/static/tabbar/首页.png",
"selectedIconPath": "/static/tabbar/首页1.png",
"pagePath": "pages/index/index",
"text": "首页"

        },  
        {  
            "iconPath": "/static/tabbar/动态.png",  
            "selectedIconPath": "/static/tabbar/动态1.png",  
            "pagePath": "pages/bbb/bbb",  
            "text": "动态"  

        },  
        {  
            "iconPath": "/static/tabbar/我的.png",  
            "selectedIconPath": "/static/tabbar/我的1.png",  
            "pagePath": "pages/ccc/ccc",  
            "text": "我的"  

        }  
    ]  
},  

、、、。。。。。。。。。。。。。。。。。。。。。。admin页面(头像,账号,密码,登录)、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、
<template>
<view>
<!-- 圆形头像 -->
<view style="display: flex;justify-content: center; margin-top: 100rpx;">
<image style="width: 200rpx;height: 200rpx;border-radius: 50%" src="/static/logo.png"></image>
</view>

    <!-- 账号密码 -->  
    <view style="margin-top: 100rpx; display: flex; flex-direction: column;align-items: center;">  
        <input v-model="username" style="border: 1rpx solid darkorchid;width: 80%;"/>  
        <input v-model="password" style="margin-top:30rpx; border: 1rpx solid darkorchid;width: 80%;"/>  
    </view>  

    <!-- 登录 -->  
    <button style="width: 75%; margin-top: 100rpx;" @click="login"> 登录</button>  
</view>  

</template>

<script>
export default {
data() {
return {
username:'',
password:''
}
},
methods: {
login(){
if (this.username == "admin" && this.password == "123") {
uni.switchTab({
url:"/pages/index/index"
})
}
}
}
}
</script>

<style>
</style>

、、、、、、、、、、、、、、、、、、、、、,,,,,,,,,搜索框,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,
<view style="display: flex;align-items: center; height:100rpx;background-color: aqua;">

        <view  
            style="margin: auto; display: flex;align-items: center; width: 80%;height: 75rpx;background-color: antiquewhite;border-radius: 30rpx;">  
            <image style="margin-left: 30rpx; width: 50rpx;height: 50rpx; " src="/static/logo.png"></image>  
            <input />  
        </view>  
    </view>  
,,,,,,,,,,,,,,,,,,,,,,,,,,,轮播图,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, <view class="uni-margin-wrap"> <swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"

duration="duration"> <swiper-item>
<view class="swiper-item uni-bg-red">
<image style="border-radius: 30rpx; width: 100%;height: 300rpx;" src="/static/logo.png"></image>
</view>
</swiper-item>

        <swiper-item>  
            <view  class="swiper-item uni-bg-red">  
                <image style="border-radius: 30rpx; width: 100%;height: 300rpx;" src="/static/logo.png"></image>  
                </view>  
        </swiper-item>  
    </swiper>  
</view>  

<script>
export default {
data() {
return {
indicatorDots: true,
autoplay: true,
interval: 2000,
duration: 500
}
},
onLoad() {
},
methods: {
}
}
</script>

<style>
.swiper {
height: 300rpx;
}

.swiper-item {  
    display: block;  
    height: 300rpx;  
    line-height: 300rpx;  
    text-align: center;  
}  

</style>

,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,功能区,,,,,,,,,,,,,,,,,,,,,,,,,
<!-- 功能区 1行四列style="margin-top: -15rpx;"可以拿来控制图片和文字的距离-->
<view style="font-size: 40rpx;font-weight: bold;margin: 30rpx 0%;">应用中心</view>

    <view style="display: flex;justify-content: space-evenly;">  
        <view style="text-align: center;">  
            <image style="width: 100rpx;height: 100rpx;" src="/static/logo.png"></image>  
            <view >瓷砖</view>  
        </view>  
        <view style="text-align: center;">  
            <image style="width: 100rpx;height: 100rpx;" src="/static/logo.png"></image>  
            <view>瓷砖</view>  
        </view>  
        <view style="text-align: center;">  
            <image style="width: 100rpx;height: 100rpx;" src="/static/logo.png"></image>  
            <view>瓷砖</view>  
        </view>  
        <view style="text-align: center;">  
            <image style="width: 100rpx;height: 100rpx;" src="/static/logo.png"></image>  
            <view>瓷砖</view>  
        </view>  
    </view>  
0 关注 分享

要回复文章请先登录注册