在UniApp中生成一张居中图片的代码如下:
<template>
<view class="container">
<image class="rounded-square" src="/static/image.jpg"></image>
<text class="text">无际AI</text>
</view>
</template>
<style>
.container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.rounded-square {
width: 200rpx;
height: 200rpx;
border-radius: 50rpx;
}
.text {
font-size: 36rpx;
margin-top: 20rpx;
}
</style>
请将上述代码添加到您的UniApp项目中的对应页面,然后将名为"image.jpg"的图片放置在项目的static
目录下。这样就可以生成一个带弧度的正方形图片,类似APP图标的效果,并且在图片下方有文字"无际AI"。您可以根据需要自行调整图片和文字的样式。