【uni-app】使用天气API做一个天气APP(全过程)- 实况、逐小时、40日

news2024/12/29 9:54:59

头一次使用uni-app写代码, 现学现卖, 写的不好的地方见谅, 申请个appid就可以运行
切换城市界面比较简单, 城市名称需要符合天气api参数规则, 录入的城市不要带市区县; 格式如: 青岛、铁西、海淀、沛县

APP效果

在这里插入图片描述

功能说明

  1. 实况天气
  2. 逐小时预报
  3. 未来7日天气
  4. 未来40日天气
  5. 空气质量详情
  6. 切换城市
  7. 更多功能开发中

开发准备

  1. 前往天气api接口官网 http://tianqiapi.com 注册账号, 进入用户中心获取appid和appsecret
  2. 修改App.vue下globalData字段内容
globalData:{
	appid : '你的appid',
	appsecret : '你的appsecret'
},
  1. 然后直接运行程序就 o了

代码下载

先贴上下载链接, 省的在最底下看不见
http://file.tianqiapi.com/uniapp_tianqi0802.zip

附完整代码

  1. 首页 > index.vue
  2. 40日预报 > month.vue
  3. 空气质量详情 > aqi.vue
  4. 切换城市 > city.vue

首页 > index.vue

<template>
	<image class="background" :src="bg"></image>
	<view class="content" style="padding: 10px 5px 10px; color:#fff; text-align: center;">

		<view style="display: flex; width: 100%; padding-bottom: 35px; font-size:16px;">
			<view style="width: 50%; text-align: left;">
				<navigator url="/pages/index/city">{{weather.city}}[切换]</navigator>
			</view>
			<view style="width: 50%; text-align: right; color:#f1f1f1;font-size:13px;">{{weather.update_time}}更新</view>
		</view>
		<view style="font-size: 32.76px;">{{weather.data[0].wea}}</view>

		<view style="font-size: 65.52px;">{{weather.data[0].tem}}°</view>
		<view style="font-size: 14px;">
			<navigator url="/pages/index/aqi">AQI {{weather.aqi.air_level}} [查看详情]</navigator>
		</view>
		<view style="padding: 8px 0 20px 0;"><text
				decode>最低{{weather.data[0].tem2}}°&nbsp;&nbsp;&nbsp;最高{{weather.data[0].tem1}}°</text>
		</view>
		<!--hours-->
		<view
			style="width:100%; overflow:scroll; border-bottom: 1px solid rgba(190, 185, 185, 0.5);border-top: 1px solid rgba(190, 185, 185, 0.5);padding:23.4rpx 0; height: 105px; min-height: 105px; max-height: 105px;">
			<view class="hlist">

				<view v-for="(item,index) in weather.data[0].hours" :key="item.id" class="hitem">
					<view>{{item.hours}}</view>
					<view style="padding: 10px 0 0;">
						<image :src="item.wea_img" mode="widthFix" style="width: 46.8rpx;"></image>
					</view>
					<view style="font-weight: 500; font-size:13px;text-align: center;">{{item.wea}}</view>
					<view style="font-weight: 500; font-size:14px;text-align: center;">{{item.tem}}°</view>
				</view>
			</view>
			<view style="clear:both;width:100%;height:1px;"></view>
		</view>
		<!--hours-->
		<!--week-->
		<view style="width:100%; padding-top: 10px;padding-bottom: 15px;">

			<view v-for="(item,index) in weather.data" :key="item.id" class="week">
				<text class="weekday">{{item.day}}</text>
				<view style="text-align: left; padding-left:30%; font-size: 13px;">
					<image :src="item.wea_img" mode="widthFix" style="width: 42rpx; vertical-align: middle;">
					</image> {{item.wea}} <text v-if="item.rain > 10"
						style="font-size:12px; color: #96dafb; margin-left: 5px;"
						wx:if="{{item.rain > 35}}">{{item.rain}}%</text>
				</view>
				<text class="weekmax">{{item.tem2}}°</text>
				<text class="weekmin">{{item.tem1}}°</text>
			</view>


		</view>
		<!--week-->
		<view style="padding:15px;">
			<navigator url="/pages/index/month"><button type="primary"
					style="font-size: 12px; border-radius: 30px; padding-left:30px;padding-right: 30px;">查看40日预报&gt;&gt;</button>
			</navigator>
		</view>
		<view class="smalltext">{{weather.data[0].narrative}}</view>

		<!--dayinfo-->
		<view style="width:100%;">
			<view style="padding:5px; text-align: left; ">
				<view style="display: flex; border-bottom: 1px solid rgba(190, 185, 185, 0.5); padding-bottom: 10px;">
					<view style="width: 50%;">
						<view style="color:#d8d6d6;">日出</view>
						<view style="font-size:16px;">上午 {{weather.data[0].sunrise}}</view>
					</view>
					<view style="width: 50%; ">
						<view style="color:#d8d6d6;">日落</view>
						<view style="font-size:16px;">下午 {{weather.data[0].sunset}}</view>
					</view>
					<view class="clearfix"></view>
				</view>
				<view
					style="display: flex; border-bottom: 1px solid rgba(190, 185, 185, 0.5); padding-top: 10px;padding-bottom: 10px;">
					<view style="width: 50%;">
						<view style="color:#d8d6d6;">湿度</view>
						<view style="">{{weather.data[0].humidity}}</view>
					</view>
					<view style="width: 50%;">
						<view style="color:#d8d6d6;"></view>
						<view style="">{{weather.data[0].win[0]}}
							{{weather.data[0].win_speed}}
						</view>
					</view>
					<view class="clearfix"></view>
				</view>
				<view
					style="display: flex;border-bottom: 1px solid rgba(190, 185, 185, 0.5); padding-top: 10px;padding-bottom: 10px;">
					<view style="width: 50%;">
						<view style="color:#d8d6d6;">气压</view>
						<view style="">{{weather.data[0].pressure}}兆帕</view>
					</view>
					<view style="width: 50%;">
						<view style="color:#d8d6d6;">空气质量</view>
						<view style="">{{weather.data[0].air_level}}</view>
					</view>
					<view class="clearfix"></view>
				</view>
				<view
					style="display: flex; border-bottom: 1px solid rgba(190, 185, 185, 0.5); padding-top: 10px;padding-bottom: 10px;">
					<view style="width: 50%;">
						<view style="color:#d8d6d6;">降雨量</view>
						<view style="">{{weather.data[0].rain_pcpn}}mm</view>
					</view>
					<view style="width: 50%;">
						<view style="color:#d8d6d6;">紫外线</view>
						<view style="">{{weather.data[0].uvDescription}}</view>
					</view>
					<view class="clearfix"></view>
				</view>
				<view style="font-size: 23.4rpx; color:#d8d6d6; padding:10px 0">数据来源:TianqiAPI.com</view>
			</view>
		</view>
		<!--./dayinfo-->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				city: '',
				weather: [],
				title: '易客API',
				phrase_img: '',
				bg: ''
			}
		},
		onLoad(e) {
			console.log('参数如下:')
			console.log(e.city);
			this.city = e.city;
			this.getWeather();
		},
		methods: {
			formatDate(date) {
				var date = new Date(date);
				return (date.getMonth() + 1) + '-' + (date.getDate()) + ' ' + date.getHours() + ':' + date.getMinutes();
			},
			openmonth() {
				uni.navigateTo({
					url: '/pages/index/month'
				})
			},
			getWeather() {
				if (this.city == undefined) {
					this.city = '';
				}
				if (this.city == '') {
					var scity = uni.getStorageSync('storage_city');
					if (scity != '') {
						this.city = scity;
					}
				}
				/* 
				天气api接口官网 http://tianqiapi.com
				appid和appsecret请在官网注册, 进入用户中心获取, 新用户可以免费请求3000次, 接口收费350一年
				*/
				const appid = getApp().globalData.appid;
				const appsecret = getApp().globalData.appsecret;
				const url = 'http://v1.yiketianqi.com/api?version=v91&ext=hours,life&appid=' + appid + '&appsecret=' +
					appsecret + '&city=' + this.city;

				uni.request({
					url: url,
					success: (res) => {

						if (res.data.errcode == "100") {
							// 错误处理
							console.error('获取天气信息失败', res.data);
						} else {
							uni.setStorageSync('storage_city', res.data.city);
							var mydata = res.data;
							console.log(mydata.data.length);

							for (var i = 0; i < mydata.data[0].hours.length; i++) {
								mydata.data[0].hours[i]['wea_img'] = '/static/skins/' + mydata.data[0].hours[i]
									['wea_img'] +
									'.png';
							}
							for (var i = 0; i < mydata.data.length; i++) {
								mydata.data[i]['wea_img'] = '/static/skins/' + mydata.data[i]['wea_img'] +
									'.png';
							}
							mydata.update_time = this.formatDate(mydata.update_time);
							console.log(mydata);

							this.weather = mydata;
							this.phrase_img = '/static/skins/' + mydata.data[0].wea_img + '.png';
							// 计算背景图
							if (mydata.data[0].wea.match(RegExp(//))) {
								this.bg = '/static/bg_sun.jpg';
							} else {
								this.bg = '/static/bg_yin.jpg';
							}
						}
					},
					fail: (error) => {
						// 请求失败处理
						console.error('请求失败', error);
					}
				});
			}
		}
	}
</script>

<style>
	.background {
		width: 100%;
		height: 100%;
		position: fixed;
		background-size: 100% 100%;
		z-index: -1;
	}

	.hlist {
		display: inline-flex;
	}

	.hitem {
		padding: 0 23.4rpx;
		width: 50px;
		text-align: center;
	}

	.week {
		font-size: 32.76rpx;
		position: relative;
		text-align: center;
		margin-top: 11.7rpx;
	}

	.weekday {
		position: absolute;
		left: 10px;
		top: 0px;
		font-size: 13px;
	}

	.weekmax {
		position: absolute;
		right: 70px;
		top: 0px;
	}

	.weekmin {
		color: #ebe7e7;
		position: absolute;
		right: 20px;
		top: 0px;
		text-align: left;
	}

	.smalltext {
		text-align: left;
		border-top: 1px solid rgba(190, 185, 185, 0.5);
		border-bottom: 1px solid rgba(190, 185, 185, 0.5);
		padding-top: 15px;
		padding-left: 15px;
		padding-bottom: 15px;
		font-size: 28.08rpx;
		width: 100%;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}

	.wea_img {
		width: 25px;
		height: 25px;
	}
</style>

40日预报 > month.vue

<template>
	<view style="background-color: rgb(0, 97, 204); height: 100%;">
		<view style="padding:10px;">
			<view style="padding: 15px; border-radius:5px; background-color: #fff; ">
				<view v-for="(item,index) in weather.data" :key="item.id">
					<view style="padding:8px 0; display: flex; border-bottom: 1px solid #f1f1f1; font-size: 14px;">
						<view style="width: 30%;font-size:13px;">{{item.date}}<br>{{item.week}}</view>
						<view style="width: 40%; text-align: left;font-size: 14px;">
							<image :src="item.wea_img" mode="widthFix" style="width: 42rpx; vertical-align: middle;">
							</image> {{item.wea}}
						</view>
						<view style="width: 30%; text-align: center;">
							<text>{{item.tem2}}° ~ {{item.tem1}}°</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				city: '',
				weather: [],
				title: '易客API',
				phrase_img: '',
				bg: ''
			}
		},
		onLoad() {
			this.getWeather();
		},
		methods: {
			formatDate(date) {
				var date = new Date(date);
				return (date.getMonth() + 1) + '-' + (date.getDate());
			},
			getWeather() {
				var scity = uni.getStorageSync('storage_city');
				if (scity != '') {
					this.city = scity;
				}
				const appid = getApp().globalData.appid;
				const appsecret = getApp().globalData.appsecret;
				const url = 'http://v1.yiketianqi.com/api?unescape=1&version=v3&appid=' + appid + '&appsecret=' +
					appsecret + '&city=' + this.city;

				uni.request({
					url: url,
					success: (res) => {

						if (res.data.errcode == "100") {
							// 错误处理
							console.error('获取天气信息失败', res.data);
						} else {
							var mydata = res.data;
							for (var i = 0; i < mydata.data.length; i++) {
								mydata.data[i]['date'] = this.formatDate(mydata.data[i]['date']);
								mydata.data[i]['wea_img'] = '/static/skins/' + mydata.data[i]['wea_img'] +
									'.png';
							}
							console.log(mydata);

							this.weather = mydata;
						}
					},
					fail: (error) => {
						// 请求失败处理
						console.error('请求失败', error);
					}
				});
			}
		}
	}
</script>

<style>

</style>

空气质量详情 > aqi.vue

<template>
	<view style="background-color: #E7ECF4; height: 100%;">
		<view style="padding:10px 10px 200px;">
			<view style="font-size: 12px; color:#333; text-align: right;">{{weather.aqi.update_time}}更新</view>
			<view style="text-align: center; padding-top: 20px;">
				<view style="font-size: 46px; ">
					<text style="position: relative; padding:10px;">{{weather.aqi.air}}<text
							style="background-color: #FFEF01; border-radius: 50%; padding:5px 8px; font-size: 14px; position: absolute; top: 0px; right:-20px;">{{weather.aqi.air_level}}</text></text>

				</view>
				<view style="padding: 10px 0;"><text
						style="font-size: 16px; background-color: #fff; color: #14C355; border-radius:8px; padding:5px;">AQI指数</text>
				</view>
				<view style="font-size: 13px; padding:10px 30px 20px;">{{weather.aqi.air_tips}}</view>
			</view>

			<view
				style="font-size: 14px; padding: 10px; border-radius:5px; background-color: #fff; display: flex; text-align: center; ">
				<view style="width: 16.66%;">
					<view style="font-size: 16px;">{{weather.aqi.pm10}}</view>PM10
				</view>
				<view style="width: 16.66%;">
					<view style="font-size: 16px;">{{weather.aqi.pm25}}</view>PM2.5
				</view>
				<view style="width: 16.66%;">
					<view style="font-size: 16px;">{{weather.aqi.no2}}</view>NO2
				</view>
				<view style="width: 16.66%;">
					<view style="font-size: 16px;">{{weather.aqi.so2}}</view>SO2
				</view>
				<view style="width: 16.66%;">
					<view style="font-size: 16px;">{{weather.aqi.o3}}</view>O3
				</view>
				<view style="width: 16.66%;">
					<view style="font-size: 16px;">{{weather.aqi.co}}</view>CO
				</view>
			</view>

			<view
				style="margin-top:15px; font-size: 14px; padding: 10px; border-radius:5px; background-color: #fff;  text-align: center; ">
				<view style="text-align: left;">{{weather.city}}未来5日天气</view>
				<view style="display: flex; ">
					<view style="width: 20%;">
						<view class="itema">
							{{weather.data[1].date}}</view>
						<view class="itemb">{{weather.data[1].wea}}
						</view>
						<view class="itemc">
							{{weather.data[1].tem2}}~{{weather.data[1].tem1}}°</view>
						<view class="itemd">
							<text
								class="iteme">{{weather.data[1].air_level}}</text>
						</view>
					</view>
					<!--2-->
					<view style="width: 20%;">
						<view class="itema">
							{{weather.data[2].date}}</view>
						<view class="itemb">{{weather.data[2].wea}}
						</view>
						<view class="itemc">
							{{weather.data[2].tem2}}~{{weather.data[2].tem1}}°</view>
						<view class="itemd">
							<text
								class="iteme">{{weather.data[2].air_level}}</text>
						</view>
					</view>
					<!--./2-->
					<!--3-->
					<view style="width: 20%;">
						<view class="itema">
							{{weather.data[3].date}}</view>
						<view class="itemb">{{weather.data[3].wea}}
						</view>
						<view class="itemc">
							{{weather.data[3].tem2}}~{{weather.data[3].tem1}}°</view>
						<view class="itemd">
							<text
								class="iteme">{{weather.data[3].air_level}}</text>
						</view>
					</view><!--./3--><!--4-->
					<view style="width: 20%;">
						<view class="itema">
							{{weather.data[4].date}}</view>
						<view class="itemb">{{weather.data[4].wea}}
						</view>
						<view class="itemc">
							{{weather.data[4].tem2}}~{{weather.data[4].tem1}}°</view>
						<view class="itemd">
							<text
								class="iteme">{{weather.data[4].air_level}}</text>
						</view>
					</view><!--./4--><!--5-->
					<view style="width: 20%;">
						<view class="itema">
							{{weather.data[5].date}}</view>
						<view class="itemb">{{weather.data[5].wea}}
						</view>
						<view class="itemc">
							{{weather.data[5].tem2}}~{{weather.data[5].tem1}}°</view>
						<view class="itemd">
							<text
								class="iteme">{{weather.data[5].air_level}}</text>
						</view>
					</view><!--./5-->
				</view>
			</view>


		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				city:'',
				weather: [],
				title: '易客API',
				phrase_img: '',
				bg: ''
			}
		},
		onLoad() {
			this.getWeather();
		},
		methods: {
			formatDate(date) {
				var date = new Date(date);
				return (date.getMonth() + 1) + '-' + (date.getDate());
			},
			getWeather() {
				var scity = uni.getStorageSync('storage_city');
				if (scity != '') {
					this.city = scity;
				}
				const appid = getApp().globalData.appid;
				const appsecret = getApp().globalData.appsecret;
				const url = 'http://v1.yiketianqi.com/api?unescape=1&version=v91&appid=' + appid + '&appsecret=' +
					appsecret + '&city=' + this.city;

				uni.request({
					url: url,
					success: (res) => {

						if (res.data.errcode == "100") {
							// 错误处理
							console.error('获取天气信息失败', res.data);
						} else {
							var mydata = res.data;
							for (var i = 0; i < mydata.data.length; i++) {
								mydata.data[i]['date'] = this.formatDate(mydata.data[i]['date']);
								mydata.data[i]['wea_img'] = '/static/skins/' + mydata.data[i]['wea_img'] +
									'.png';
							}
							console.log(mydata);

							this.weather = mydata;
							// update title
							uni.setNavigationBarTitle({
								title: this.weather.city + '空气质量'
							});
						}
					},
					fail: (error) => {
						// 请求失败处理
						console.error('请求失败', error);
					}
				});
			}
		}
	}
</script>

<style>
.itema{font-size: 16px;padding-top: 10px; padding-bottom: 5px;font-size: 13px;}
.itemb{font-size: 16px;padding-bottom: 5px;font-size: 12px; white-space: nowrap;}
.itemc{font-size: 16px;padding-bottom: 10px;font-size: 14px;}
.itemd{font-size: 16px;font-size: 12px;padding-bottom: 10px;}
.iteme{background-color: #FFEF01; border-radius: 10px; padding:2px 5px;}
</style>

切换城市 > city.vue

<template>
	<view style="padding: 10px;">
		<input class="uni-input" style="border: 1px solid #dcdcdc; border-radius: 15px; padding:10px 20px;" focus
			placeholder="请输入城市名称" confirm-type="search" inputmode="search" @confirm="gocity" @input="onKeyInput" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				inputValue: ''
			}
		},
		methods: {
			onKeyInput: function(event) {
				this.inputValue = event.detail.value;
				console.log(this.inputValue);
			},
			gocity() {
				console.log(this.inputValue);
				//uni.setStorageSync('city', 'hello');
				uni.reLaunch({
					url: '/pages/index/index?city=' + this.inputValue
				});
			}
		}
	}
</script>

<style>

</style>

感谢阅读

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2047563.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Qt】QWidget的toolTip属性

QWidget的toolTip属性 如果一个GUI程序&#xff0c;界面比较复杂&#xff0c;按钮比较多&#xff0c;使用toolTip可以设置当鼠标悬停在控件上的时候&#xff0c;可以弹出一个提示。 API说明 setToolTip 设置 toolTip. ⿏标悬停在该 widget 上时会有提⽰说明. setToolTipDur…

10 ARM 体系

10 ARM 体系 ARM体系1、基本概念1.1 常见的处理器1.2 ARM7三级指令流水线1.3 初识PC寄存器 2、 ARM核的七种工作模式3、ARM核七种异常 ARM体系 1、基本概念 1.1 常见的处理器 PowerPC处理器&#xff1a;飞思卡尔MPC系列 DSP:TI达芬奇系列 FPGA&#xff1a;Xilinx赛灵思的ZYN…

python小游戏之摇骰子猜大小

最近学习Python的随机数&#xff0c;逻辑判断&#xff0c;循环的用法&#xff0c;就想找一些练习题&#xff0c;比如小游戏猜大小&#xff0c;程序思路如下&#xff1a; 附上源代码如下&#xff1a; 摇骰子的函数&#xff0c;这个函数其实并不需要传任何参数&#xff0c;调用后…

理性看待、正确理解 AI 中的 Scaling “laws”

编者按&#xff1a;LLMs 规模和性能的不断提升&#xff0c;让人们不禁产生疑问&#xff1a;这种趋势是否能一直持续下去&#xff1f;我们是否能通过不断扩大模型规模最终实现通用人工智能&#xff08;AGI&#xff09;&#xff1f;回答这些问题对于理解 AI 的未来发展轨迹至关重…

独立开发者,技术只是其一

刚开始做独立开发者时&#xff0c;总是想着追究技术的深度。我的软件用了特别牛的技术&#xff0c;我的软件这个功能技术花了很多个日日夜夜才实现&#xff01;真的好有成就感啊&#xff01; “额&#xff0c;请问一下&#xff0c;你技术这么牛&#xff0c;卖出去多少钱啦&…

linux如何配置主机间免密ssh连接

1. 生成key 其实就是配置从本地节点到远程主机之间基于key&#xff08;无密码的方式&#xff09;的SSH连接&#xff1a; # 生成ssh keyssh-keygen2. 拷贝key到远端主机 # 拷贝ssh key到远程主机&#xff0c;ssh的时候就不需要输入密码了# ssh-copy-id remoteuserremoteserve…

通过电影之镜,提升生活之美

在快节奏的现代生活中&#xff0c;电影不仅是娱乐的载体&#xff0c;更是提升审美情趣、拓宽视野的窗口。三部各具特色的经典之作——《布达佩斯大饭店》、《花样年华》与《天使爱美丽》&#xff0c;以其独特的视觉风格、深刻的情感表达与细腻的艺术构思&#xff0c;为我们展示…

三十九、【人工智能】【机器学习】【监督学习】- 多项式朴素贝叶斯分类器(Multinomial Naive Bayes)

系列文章目录 第一章 【机器学习】初识机器学习 第二章 【机器学习】【监督学习】- 逻辑回归算法 (Logistic Regression) 第三章 【机器学习】【监督学习】- 支持向量机 (SVM) 第四章【机器学习】【监督学习】- K-近邻算法 (K-NN) 第五章【机器学习】【监督学习】- 决策树…

追踪团贷网第1968天:重磅!派生科技的股权准备拍卖!合计8.51亿

周五晚&#xff0c;聊聊团贷网最新消息。 继续关注团贷网涉案资产的拍卖。 这周又有重大进展&#xff0c;派生科技的股权与股票&#xff0c;终于要开始拍卖了。 (来自京东拍卖网) (来自京东拍卖网) 目前正在预热阶段&#xff0c;将会在9月18日集中拍卖&#xff0c;而且拆分成…

Visual C++ 2010 学习版

这个版本很好用。 在这里放一个链接&#xff0c;做个备份。 这个版本是承前启后的版本&#xff0c;非常的重要。 一、使用VC2010 这个版本创建的解决方案可以在VS2010~VS2022版本中打开&#xff0c;反之也行。 二、使用VC2010 可以编绎VC6.0 ~VC2008的项目。可以使用现成的…

让护眼旗舰体验全面普及!书客L2 PRO凭借医学养护眼爆火受追捧!

为了满足消费者日益增长的健康需求&#xff0c;书客宣布推出其最新款护眼台灯——[书客L2 PRO护眼台灯]。书客作为深耕照明领域多年的品牌&#xff0c;八年间始终坚持着医护级“护眼更养眼”的理念&#xff0c;这一款[养眼更护眼]的巅峰力作备受业界的瞩目与期待。书客L2 PRO护…

Visual Studio 2022 无法打开源文件atlimage.h

最近在搞tcp socket 通信demo&#xff0c;网上抄了一下源码&#xff08;代码参考&#xff1a;C中的Socket编程使用协议发送图片_快速传输 照片 c-CSDN博客&#xff09;&#xff0c;还没开始编译就提示 无法打开源文件atlimage.h&#xff0c;全局搜了一下没有这个文件&#xff0…

(七)Activiti-modeler中文支持

1、修改app.js&#xff0c;51行 注意第3步&#xff0c;之前已经访问过&#xff0c;缓存到cookie了&#xff0c;这里要么注释该方法&#xff0c;要么去浏览器手动删除对应cookie才能使用下面的zh-CN.json 2、i18n\en.json中添加zh-CN.json &#xff08;以下代码片断为网上获得…

进阶岛【闯关任务】探索 InternLM 模型能力边界

一、任务介绍 在 CompassArena 中选择双模型对话&#xff0c;与InternLM2.5及另外任意其他模型对话&#xff0c;收集 5 个 InternLM2.5 输出结果不如其他模型的对话案例&#xff0c;以及 InternLM2.5 的 5 个 Good Case。 任务地址&#xff1a;Docs 二、评测指标 可以从评测…

CSS小玩意儿:文字适配背景

一&#xff0c;效果 二&#xff0c;代码 1&#xff0c;搭个框架 添加一张背景图片&#xff0c;在图片中显示一行文字。 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" conte…

怎么等比例调整图片尺寸大小?调整图片尺寸的8个方法

在数字时代&#xff0c;图片已成为我们日常生活与工作中不可或缺的一部分。从社交媒体分享到专业设计项目&#xff0c;图片的质量和外观直接影响着信息的传达与接收。因此&#xff0c;在处理图片时&#xff0c;保持其原始的纵横比&#xff0c;即等比例调整图片尺寸&#xff0c;…

数字媒体产业发展现状剖析,洞悉数字产业园的创新之举

在当今数字化时代&#xff0c;数字媒体产业发展迅猛&#xff0c;呈现出一片繁荣景象。然而&#xff0c;在这繁荣的背后&#xff0c;数字媒体产业发展现状也存在着诸多挑战与机遇。 数字媒体产业发展现状的一个显著特点是技术的快速更新换代。从虚拟现实&#xff08;VR&#xf…

智能驾驶时代的中控屏UI设计创新

当前&#xff0c;汽车交互设计领域正蓬勃发展&#xff0c;其中以中控屏的交互设计尤为突出。这种设计现状显示了其在汽车行业中的广泛应用和重要性。中控屏的设计不仅提升了驾驶体验&#xff0c;还增强了车辆的功能性与安全性。利用通用的中控屏 UI 设计模板能够快速设计出一个…

【ubuntu】ROS(1)

1 ROS安装 基于 ubuntu 20.04 ubuntu 镜像下载地址&#xff1a;Index of / 1.1 设置安装源 设置ROS源 sudo sh -c echo "deb http://packages.ros.org/ros/ubuntu $(lsb_release -sc) main" > /etc/apt/sources.list.d/ros-latest.list 设置密钥 sudo apt-key…

c语言---文件

这一节我准备分三个部分来带领大家了解文件 ——一、有关文件的基础知识 ————二、文件的简单操作 ————————三、文件结束的判定 ————————————四、文件缓冲区 一、文件的基础知识&#xff1a; 首先在了解文件之前&#xff0c;我们需要了解C/C程序内存…