鸿蒙 HarmonyOS NEXT星河版APP应用开发-阶段一
一、鸿蒙开发环境搭建
DevEco Studio安装
- 下载
- 访问官网:https://developer.huawei.com/consumer/cn/deveco-studio/
- 选择操作系统版本后并注册登录华为账号既可下载安装包
- 安装
- 建议:软件和依赖安装目录不要使用中文字符
- 软件安装包下载完成后,解压文件,双击软件安装包可执行程序,选择安装位置,下一步直到安装结束。
- 软件安装完成后,双击软件进入显示页面。
- 依赖安装
- node安装的两种模式:
- 使用本地安装的nod环境的
- 或者通过DevEco Studio进行安装(建议选择)
- 点击Next
- node安装的两种模式:
- SDK安装
- 选择安装位置
- 点击Next
- 点击同意,再点击Next,开始进行依赖下载。
- 点击Finish,依赖下载完成
二、新建项目
- 第一次打开软件页面
- 点击create Project
- 选择空模板,点击下一步
- 填写项目信息并点击完成按钮,项目建立完成
- 点击右侧边栏previewer可以预览代码效果
三、ARkTS语言
简介
ArkTS是HarmonyOS应用开发语言。它在保持TypeScript(简称TS)基本语法风格的基础上,对TS的动态类型特性施加更严格的约束,引入静态类型。同时,提供了声明式UI、状态管理等相应的能力,让开发者可以以更简洁、更自然的方式开发高性能应用
日志打印
console.log("今天也是加油的一天。")
基础数据类型、变量、常量
- 基础数据类型
// 三种常见的基础数据类型
// string 字符串
// number 数字
// boolean 布尔(真、假)console.log(typeof "varin")
console.log(typeof 1)
console.log(typeof true)
console.log(typeof false)
- 变量
//用来存储数据的容器
// 命名规则:只能包含数字、字符、下划线、$,不能以数字开头;不使用关键字和保留字;区分大小写
// 语法: let 变量名: 类型 = 值let name : string = "varin"
console.log(name)
// 修改值
name = 'a'
console.log(name)
- 常量
// 存储不可变的数据,强行修改会爆错
// 语法:const 变量名 :数据类型 = 值const PI :number = 3.14
console.log("π:", PI)
有序数组
// 语法: let 数组名:数据类型[] = [值1,值2]
let names:string[] = ["小明","小红","小美"]
// 打印数据中的所有值
console.log(names.toString())
// 修改names数组中下标为0的值
names[0]="小小明"
// 打印nams数组中下标为0的值
console.log(names[0])
函数
简介:函数是特殊功能的可以重复使用的代码块
/*
定义函数
语法:
function 函数名(形参......){
}
调用函数语法:
函数名(实参)
*/
// 场景:传参打印不同数量的☆
function printStars(num:number){if(num<=0){return"数量错误"}let result:string = ""for (let i = 0; i < num; i++) {result+="☆"}return result;
}
// 调用函数方式1
console.log(printStars(1))
console.log(printStars(3))
console.log(printStars(5))
// 调用函数方式2
let starss:string = printStars(6)
console.log(starss)
箭头函数
简介:比普通的函数写法更加的简洁
/*
语法1:
()=>{}
语法2:
#定义
let 函数名=(形参)=>{return 结果
}
#调用:函数名(实参)*/
let printStars = (num:number)=>{let result :string = ""for (let i = 0; i < num; i++) {result+="☆";}return result;
}
console.log(printStars(1))
console.log(printStars(3))
console.log(printStars(5))
let starss:string = printStars(6)
console.log(starss)
对象
简介:对象是用于描述物体的行为和特征,可以存储多种数据的容器。
/*
定义:
1 通过interface接口约定,对象的结构类型:
语法:
interface 接口名{属性1:类型属性2:类型
}2 调用对象语法:
let 对象名:接口名={属性1:值属性1:值
}
*/
//
interface Person{name:stringage:numberweight:number
}
let person :Person={name:'张三',age:11,weight:111.1
}
console.log(person.name)
console.log(person.age.toString())
console.log(person.weight.toString())
对象方法
简介:描述对象的行为
/*
1、约定方法类型
语法:
interface 接口名{方法名:(形参)=>返回值类型
}
2、添加方法(箭头函数)
语法:
let 对象名:接口名={方法名:(形参)={方法体}
}
*/
interface Person {name:string,play:(type:string)=>void
}let person : Person={name:'张三',play:(type:string)=>{console.log(person.name+"喜欢玩"+type+"类型的游戏")}
}
console.log(person.name)
person.play("创造")
联合类型
简介:联合类型是一种灵活的数据类型,它修饰的变量可以存储不同类型的数据。
/*场景:一个变量既要存字符串也要存数字类型语法:let 变量:类型1 | 类型2| 类型3=值
*/
let result : number |string = 100
console.log(typeof result)
result = "A"
console.log(typeof result)
扩展:联合类型也可以限制数据在一个范围内
// 性别限制:值只能是man或woman,填写其他将会报错。
let gender: 'man'| "woman" = "man"
枚举类型
简介:约定变量只能在一组数据范围内选择值
/*
定义语法:
enum 常量名{
常量1=值,
常量2=值,}
调用语法:
常量名.常量1
*/
enum Colors{Red="#f00",Green="#0f0",Blue="#00f"
}
console.log(Colors.Red)
// 约束类型调用
let green :Colors = Colors.Green
console.log(green)
四、初识鸿蒙应用界面开发
Index.ets文件解读
@Entry
@Component
struct Index {@State message: string = 'varin';build() { // 构建Row() { // 行Column() { // 列Text(this.message) // 文本.fontSize(12) // 字体大小.fontWeight(FontWeight.Bold) // 字体粗细.fontColor("red") // 字体颜色}.width('100%') // 列宽}.height('50px') // 行高}
}
界面开发-布局思路
布局思路:先排版,再放内容。
注意点:build只能有一个根元素,并且是容器组件
扩展:
- ArkUI(方舟开发框架)是构建鸿蒙应用的界面框架
- 构建页面的最小单位是:组件
- 组件的分类
- 基础组件:页面呈现的基础元素如:文字、图片、按钮等
- 容器组件:控制布局排布,如:Row行,Column列等。
组件语法:
- 容器组件:Row、Column
容器组件(){}
- 基础组件:文字Text、图片
基础组件(参数).参数方法(参数)
示例效果实现
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Text("小说简介").textAlign(TextAlign.Start).width("100%").padding("20").fontWeight(FontWeight.Bold)Row(){Text("都市").textAlign(TextAlign.Start).width("23%").padding("5").fontWeight(FontWeight.Bold).backgroundColor("#f5f5f5").margin("10px")Text("生活").textAlign(TextAlign.Start).width("23%").padding("5").fontWeight(FontWeight.Bold).backgroundColor("#f5f5f5").margin("10px")Text("情感").textAlign(TextAlign.Start).width("23%").padding("5").fontWeight(FontWeight.Bold).backgroundColor("#f5f5f5").margin("10px")Text("男频").textAlign(TextAlign.Start).width("23%").padding("5").fontWeight(FontWeight.Bold).backgroundColor("#f5f5f5").margin("10px")}.width("100%").height("100px")}}
}
组件的属性方法
- 组件方法使用
/*
组件(){}
.属性方法(参数)
.属性方法(参数)
*/Text("男频").textAlign(TextAlign.Start).width("23%").padding("5").fontWeight(FontWeight.Bold).backgroundColor("#f5f5f5").margin("10px")
- 通用属性
width()
height()
backgroundColor()
- 实现效果
// 初始结构代码
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Text("小说简介")Row(){Text("都市")Text("生活")Text("情感")Text("男频")}}}
}
// 实现效果代码
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Text("小说简介").width("100%").fontSize(18).height(40).fontWeight(FontWeight.Bold) // 100---900Row(){Text("都市").width(50).height(30).backgroundColor(Color.Orange)Text("生活").width(50).height(30).backgroundColor(Color.Pink)Text("情感").width(50).height(30).backgroundColor(Color.Yellow)Text("男频").width(50).height(30).backgroundColor(Color.Gray)}.width("100%")}}
}
字体颜色
- 简介:给字体设置颜色
- 使用方法
- 使用Color枚举类
- 使用十六进制自己定义颜色
// 使用枚举类
Text("xx").fontColor(Color.Pink)
// 使用十六进制定义
Text("xx").fontColor("#f00")
实现效果
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Text("学鸿蒙").width("100%").height(30).lineHeight(30).fontWeight(500)Row(){Text("置顶").width(30).height(20).fontSize(12).fontColor("#ff910404")Text("新华社").width(40).height(20).fontSize(12).fontColor("#ff918f8f")}.width("100%")}}
}
文字溢出省略号、行高
- 语法
/*溢出省略号语法,需要配合maxLines(行数)使用
*/
.textOverflow({overflow:TextOverflow:xxx
})
// 行高
.lineHeight(高度)
- 实现效果
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Text("Harmony OS开发").height(50).lineHeight(50).width("100%").fontSize(34).fontWeight(FontWeight.Bold)Row(){Text("方舟开发框架(简称ArkUI)为HarmonyOS应用的UI开发提供了完整的基础设施,包括境界的UI语法、丰富的").maxLines(2).textOverflow({overflow:TextOverflow.Ellipsis}).height(60).lineHeight(30)}}}
}
图片组件
- 语法
// 本地图片存放位置:src/main/resources/base/media
// 网络图片:使用url即可
Image(图片数据源)
// 引用图片写法:
Image($r("app.media.文件名"))
- 大致实现效果
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Image("https://p4.itc.cn/images01/20231117/8fc1311a803348288b8af7139f47c364.jpeg").height(200).width("100%").borderRadius(10)Text("Harmony OS开发").width("100%").lineHeight(30).fontSize(18).fontWeight(FontWeight.Bold)Text("方舟开发框架(简称ArkUI)为HarmonyOS应用的UI开发提供了完整的基础设施,包括境界的UI语法、丰富的").maxLines(2).textOverflow({overflow:TextOverflow.Ellipsis}).textIndent(20).lineHeight(30)Row(){Image("https://p4.itc.cn/images01/20231117/8fc1311a803348288b8af7139f47c364.jpeg").height(20).width(20).borderRadius(100)Text("Varin").fontWeight(400).width(40).textAlign(TextAlign.End)Text("2024-06-22").fontWeight(400).width("80%").fontColor("#ff797575").textAlign(TextAlign.End)}.width("100%").height(40)} .margin("1%")}
}
输入框和按钮
- 语法
// 输入框
// 参数对象:placeholder 提示文本
// 属性方法:.type(InputType.xxx) 设置输入框的类型
TextInput(参数对象)
.属性方法()
// 示例:
TextInput({placeholder:"占位符"
}).type(InputType.Password)// 按钮语法
Button("按钮文本")
- 实现效果
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column() {TextInput({placeholder:"请输入用户名"}).width("96%").height(60).margin(10)TextInput({placeholder:"请输入密码"}).width("96%").height(60).margin(10).type(InputType.Password)Button("登录").width("50%")}.width("100%").height(40)}
}
控件之间的间隙
- 语法
// 控制Colunm 和Row内元素的间隙
Column({space:10
})
综合-华为登录
实现效果图
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Row(){}.height(60)Image($r("app.media.hw")).width(60).height(60).borderRadius(60)Column({space:20}){TextInput({placeholder:"请输入用户名"}).width("96%")TextInput({placeholder:"请输入密码"}).type(InputType.Password).width("96%")Button("登录").width("96%")}.margin("2%")Row({space:10}){Text("前往注册")Text("忘记密码")}}}
}
SVG图标
介绍:SVG图标,任意放大缩小不失真,可以改颜色
- 语法
// 语法和Image类似
// .fillColor("#f00") 修改颜色Image($r("app.media.ic_public_play_next")).fillColor("#f00").width(20).width(20)
布局元素
- 语法
/
*内边距:padding()外边距:margin()边框:border()*
/
// 1.padding使用
// 场景一:四边边距都一样
padding(10)
// 场景二:四边边距不一样
padding({top:10,right:1,bottom:11,left:23
})// 2.margin使用
// 场景一:四边边距都一样
margin(10)
// 场景二:四边边距不一样
margin({top:10,right:1,bottom:11,left:23
})
// 3.border使用
// 场景一:四边边框都一样Text("aaa").border({color:"#ff0", // 颜色width:1, // 必填radius:10, // 圆角style:BorderStyle.Solid // 边框类型:Solid(实线)})
// 场景二:四边边框不一样(只设置了右边框)Text("aaa").border({color:"#ff0",width:{right:1},radius:10,style:BorderStyle.Solid})
- 实现效果一
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Row(){Row(){Image($r("app.media.ic_public_list_add_transparent")).width(15).height(15)Text("状态").fontColor("#ff7e7d7d").fontSize(12).margin({left:5,right:7})}.border({width:1,color:"#ffb1aeae",style:BorderStyle.Solid,radius:30}).margin({left:10,top:10}).padding(5)Row(){Image($r("app.media.hw")).borderRadius(50).width(15).height(15)Image($r("app.media.hw")).borderRadius(50).width(15).height(15).margin({left:-5})Image($r("app.media.hw")).borderRadius(50).width(15).height(15).margin({left:-5})Text("3个朋友").fontColor("#ff7e7d7d").fontSize(12).margin({left:5})Row(){}.width(10).height(10).borderRadius(50).backgroundColor("red").margin({left:10,right:10})}.border({width:1,color:"#ffb1aeae",style:BorderStyle.Solid,radius:30}).margin({left:10,top:10}).padding(5)}}
}
- 实现效果二
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Image($r("app.media.hw")).borderRadius(50).width(100).height(100)Text("大王叫我来巡山").fontWeight(FontWeight.Bold).margin({top:10,bottom:50})Button("QQ登录").width("96%").margin({bottom:10})Button("微信登录").width("96%").backgroundColor("#ffe5e5e5").fontColor("#000")}.margin({top:20,left:"2%",right:'2%'}).width("96%")
组件圆角
- 语法
// borderRadius使用
// 场景一:四边都一样
borderRadius(10)
// 场景二:四边不一样
.borderRadius({topLeft:1,topRight:2,bottomLeft:1,bottomRight:2
})
背景属性
- 语法
/*
背景色:backgroundColor
背景图:backgroundImage
背景图位置:backgroundOpsition
背景图尺寸:backgroundSize*/
- 示例:背景图
/*
ImageRepeat:平铺枚举*/
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Text("测试").backgroundImage($r("app.media.hw"),ImageRepeat.XY).width("100%").height("100%").fontColor("red")}.padding(20)}
}
- 示例:背景图位置
/*
backgroundImagePosition()
两种形式:
一、使用x,y轴
二、使用Alignment枚举类*/
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Text("测试").backgroundImage($r("app.media.hw")).backgroundColor(Color.Pink).backgroundImagePosition(Alignment.Center).width("100%").height("100%").fontColor("red")}.padding(20)}
}
- 示例:背景图大小
/*两种方式:方式一:backgroundSize({width:10,heigth:10}}方式二:使用枚举:ImageSize
*/
背景定位-单位问题
- 扩展:
- 背景使用的单位是px(像素点)
- 宽高默认单位:vp(虚拟像素),可以对不同设备会自动转换,保证不同设备视觉一致。
- vp2px():可将vp进行转换,得到px的数值
线性布局
线性布局(LineLayout)通过线性容器Column和Row创建。
- 语法
// column:垂直
// Row: 水平
- 排布主方向上的对齐方式
// 属性
.justifyContent(枚举FlexAlign)
// 枚举三个参数:Start(上) Center(中)End(下)
布局案例-个人中心-顶部导航
- 实现效果
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Row(){Image($r("app.media.ic_arrow_left")).width(20)Text("个人中心")Image($r("app.media.ic_more")).width(20)}.height(40).backgroundColor(Color.White).width("100%").padding(10).justifyContent(FlexAlign.SpaceBetween).border({width:{bottom:1},style:BorderStyle.Solid,color:"#ffe0e0dc"})}.width("100%").height("100%").backgroundColor("#ffe9e9e9")}
}
线性布局-交叉轴对齐方式
// 属性:alignitems()
// 参数:枚举类型
// 交叉轴在水平方向:horizontalalign
// 交叉轴在垂直方向:verticalalign// Column>>>>h
//Row>>>>V
案例-得物列表项展示
实现效果
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Row(){Column(){Text("玩一玩").fontSize(20).lineHeight(40).fontWeight(FontWeight.Bold).textAlign(TextAlign.Start)Row(){Text("签到兑礼").fontColor("#ffaeacac").fontSize(14)Text("|").fontColor("#ffaeacac").fontSize(14).margin({left:5,right:5})Text("超多大奖").fontColor("#ffaeacac").fontSize(14)Text("超好玩").fontColor("#ffaeacac").fontSize(14)}}.alignItems(HorizontalAlign.Start).margin({left:20})Image($r("app.media.cat")).width(70).borderRadius(10)Image($r("app.media.ic_arrow_right")).fillColor("#ff858383").width(30).margin({right:15})}.justifyContent(FlexAlign.SpaceBetween).width("100%").height(100).backgroundColor(Color.White).border({color:"#fff3f2f2",width:1,radius:10,style:BorderStyle.Solid})}.width("100%").height("100%").padding(5).backgroundColor("#f5f5f5")}
}
自适应伸缩(权重分配)
- 语法
// 属性
.layoutWeight(权重分配)
- 示例
/*
一行 text3宽为固定值:50,
剩下的宽将分为5分
text1占1份
text2占4份
*/
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Row() {Text("1").height(30).layoutWeight(1).backgroundColor("#f00")Text("2").height(30).layoutWeight(4).backgroundColor("#0f0")Text("3").height(30).width(50).backgroundColor("#00f")}.width("100%").height(30)}
}
案例-得物卡片
实现效果
import { Filter } from '@ohos.arkui.advanced.Filter';@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Column(){Text("每日艺术分享.......").fontWeight(700).height(40)Text("No.43").height(20).fontWeight(700)Row(){Image($r("app.media.cat")).width(15).height(15).borderRadius(15)Text("插画师分享聚集地").layoutWeight(1).fontSize(12).padding({left:5})Image($r("app.media.ic_like")).width(10).height(10).fillColor("#ff8f8b8b")Text("2300").fontColor("f5f5f5").fontSize(12).padding({left:5})}.height(40)}.alignItems(HorizontalAlign.Start).padding(10).justifyContent(FlexAlign.End).borderRadius(10).width("70%").backgroundImage($r("app.media.nick")).backgroundImageSize({width:"100%",height:'70%'}).height(350).backgroundColor(Color.White).margin({top:10})}.width("100%").height("100%").backgroundColor("#ffcbc9c9")}
}
案例-京东登录页
实现效果
/*
扩展:
checkBox:复选框
span组件,在一段文本中单独修改某些文本,可以使用span包裹
blank组件:弹簧组件,可以自动撑开row或colum的宽或高(填充空白区域)
*/import { Filter } from '@ohos.arkui.advanced.Filter';
@Entry
@Component
struct Index {@State message: string = 'varin';build() {Column(){Row(){Text("×").fontSize(25)Text("帮助")}.width("100%").justifyContent(FlexAlign.SpaceBetween)Image($r("app.media.jd_logo")).width(250)// TextInput({placeholder:"国家/地址"})// .backgroundColor(Color.White)Row(){Text("国家/地址").fontColor("#777").layoutWeight(1)Text("中国(+86)").fontColor("#777")Image($r("app.media.ic_arrow_right")).height(20).fillColor("#777")}.width("100%").height(50).borderRadius(20).backgroundColor(Color.White).padding({left:15,right:15})TextInput({placeholder:"请输入手机号"}).backgroundColor(Color.White).margin({top:10})Row(){// 单选// Radio({// value:'1',// group:"1"// }).checked(false).backgroundColor(Color.White)// 复选Checkbox().width(10)Text(){Span("我已经阅读并同意")Span("《京东隐私政策》").fontColor("#00f")Span("《京东用户服务协议》").fontColor("#00f")Span("未注册的手机号将自动创建京东账号")}.fontSize(13).margin({top:3})// Column({space:5}){//// Text("我已经阅读并同意《京东隐私政策》 《京东用户服务协议》")// .padding({top:12})// .fontSize(11)////// Text("未注册的手机号将自动创建京东账号")// .fontSize(11)//// }.layoutWeight(1)// .alignItems(HorizontalAlign.Start)}.alignItems(VerticalAlign.Top).margin({top:25})// .backgroundColor("red")Button("登录").width("100%").backgroundColor("#ffc11010").margin({top:15})Row(){Text("新用户注册").fontSize(12).fontColor("#666")Text("账号密码登录").fontSize(12).fontColor("#666")Text("无法登录").fontSize(12).fontColor("#666")}.width("100%").padding(15).justifyContent(FlexAlign.SpaceEvenly)Blank()Column(){Text("其他登录方式").fontSize(14).margin({bottom:20})Row(){Image($r("app.media.jd_huawei")).width(32).borderRadius(16)Image($r("app.media.jd_wechat")).width(32).borderRadius(16).fillColor("#ff089408")Image($r("app.media.jd_weibo")).width(32).borderRadius(16).fillColor("#ffd41010")Image($r("app.media.jd_QQ")).width(32).borderRadius(16).fillColor("#ff05afcd")}.width("100%").justifyContent(FlexAlign.SpaceBetween).padding({left:20,right:20})}.margin({bottom:10})}.width("100%").height("100%").backgroundImage($r("app.media.jd_login_bg")).backgroundImageSize(ImageSize.Cover).padding({left:15,right:15,top:10,bottom:20})}
}
相关文章:
![](https://img-blog.csdnimg.cn/img_convert/429d46e0469fb4f9a621ca5387ff9453.png)
鸿蒙 HarmonyOS NEXT星河版APP应用开发-阶段一
一、鸿蒙开发环境搭建 DevEco Studio安装 下载 访问官网:https://developer.huawei.com/consumer/cn/deveco-studio/选择操作系统版本后并注册登录华为账号既可下载安装包 安装 建议:软件和依赖安装目录不要使用中文字符软件安装包下载完成后࿰…...
![](https://www.ngui.cc/images/no-images.jpg)
Elasticsearch优化索引映射和设置
在Elasticsearch的世界中,优化索引的映射(mapping)和设置(settings)对于提高搜索性能、存储效率和系统稳定性至关重要。本文将带您深入了解如何针对Elasticsearch的索引进行优化,帮助您构建更高效、更可靠的…...
![](https://img-blog.csdnimg.cn/direct/54d03dae6032432eab742755997a24eb.png)
boss直聘招聘数据可视化分析
boss直聘招聘数据可视化分析 一、数据预处理二、数据可视化三、完整代码一、数据预处理 在 上一篇博客中,笔者已经详细介绍了使用selenium爬取南昌市web前端工程师的招聘岗位数据,数据格式如下: 这里主要对薪水列进行处理,为方便处理,将日薪和周薪的数据删除,将带有13薪…...
![](https://www.ngui.cc/images/no-images.jpg)
小程序人脸分析
公司的业务需求是用户在使用某个功能前,必须使用人脸识别,确保当前使用人是用户本人,防止某些功能乱用。后端用的是腾讯的人脸识别方案,这里只是前端的识别代码,保证人脸剧中,大小合适,有一个人…...
![](https://img-blog.csdnimg.cn/direct/d4a3f7989b534e9b8b67a6fa085b1129.jpeg)
UML建模笔记
5个视图 设计。类,接口,对象如何协作。实现。组件,运行程序,文档关系。用例。用户功能期望。进程。并发与同步相关进程,线程。部署。部署到计算机。 建模目的 和客户共创追踪需求变更协同开发进度控制持续迭代测试生…...
![](https://www.ngui.cc/images/no-images.jpg)
初见SpringCloud ing
Consul 服务注册与发现 服务注册与发现 服务注册:微服务在启动时,会将自己的信息(如 IP 地址、端口、服务名称等)注册到 Consul。 服务发现:其他微服务可以通过 Consul 查询到已注册的服务,并通过这些信息…...
![](https://img-blog.csdnimg.cn/direct/be97d6772f374641be382ba48ef90b18.png)
Python | Leetcode Python题解之第198题打家劫舍
题目: 题解: class Solution:def rob(self, nums: List[int]) -> int:if not nums:return 0size len(nums)if size 1:return nums[0]first, second nums[0], max(nums[0], nums[1])for i in range(2, size):first, second second, max(first nu…...
![](https://img-blog.csdnimg.cn/direct/210ffb55670e4fa1bc9e3e7696ade4c3.png)
什么是中断?---STM32篇
目录 一,中断的概念 二,中断的意义 三,中断的优先级 四,中断的嵌套 如果一个高优先级的中断发生,它会立即打断当前正在处理的中断(如果其优先级较低),并首先处理这个高优…...
![](https://www.ngui.cc/images/no-images.jpg)
51单片机第1步_putchar()和_getkey()应用
没有开发板,没有烧录器,没有学习场所,如何学习写51单片机的程序?除了采用软件模拟仿真,没有更好的方法,因此,使用串口是学习的第一步。 1、_getkey ()函数 在C:\Keil\C51\LIB中有一个叫GETKEY…...
![](https://www.ngui.cc/images/no-images.jpg)
微信小程序中的地图的使用
微信小程序中的地图组件 是一个用于展示地图的组件,提供了丰富的功能和配置选项,可以实现定位、标记、路线规划等多种地图相关的交互。下面是对这个组件的详细介绍,包括属性、事件以及示例代码。 组件属性 基础属性 longitude: 地图中心的经…...
![](https://www.ngui.cc/images/no-images.jpg)
MySQL root密码丢失处理
没有记住MySQL数据库root用户默认密码(为初始化安装mysql时默认生成) 1)修改/etc/my.cnf文件,在[mysqld]的段中加上一句:skip-grant-tables 重启mysql服务 [root@localhost ~]# service mysqld restart 2)以无密码方式进入mysql: [root@localhost ~]# /usr/local/my…...
![](https://img-blog.csdnimg.cn/direct/aec44f5c93b44629b22bb5e9e1ee8311.png)
RabbitMQ中java实现队列和交换机的声明
java实现队列和交换机的声明 在之前我们都是基于RabbitMQ控制台来创建队列、交换机。但是在实际开发时,队列和交换机是程序员定义的,将来项目上线,又要交给运维去创建。那么程序员就需要把程序中运行的所有队列和交换机都写下来,…...
![](https://www.ngui.cc/images/no-images.jpg)
解决SPA(单页应用)首屏加载速度慢
SPA是目前流行的前端开发模式,相对于传统的多页面用户体验更好,操作更顺畅,开发效率也更高。但是SPA首屏加载速度慢一直是个致命的问题,由于SPA应用首次打开需要一次性加载大量的静态资源,这就导致了加载速度慢的问题&…...
![](https://img-blog.csdnimg.cn/direct/7c979c34b1ea4de9b07757db98e99e72.png)
ElementUI框架搭建及组件使用
前言: 当开始使用ElementUI框架来搭建网站或Web应用程序时,了解框架的基本结构和组件的使用是至关重要的。ElementUI是一个基于Vue.js的框架,提供了丰富的UI组件和工具,可以帮助开发人员快速构建现代化的用户界面。 在本文中,我…...
![](https://img-blog.csdnimg.cn/img_convert/3d84761eedaa2870d289ca0aa4f68671.jpeg)
同三维T908转换器 SDI转DVI/HDMI/VGA/色差分量/AV转换器
同三维T908转换器 SDI转DVI/HDMI/VGA/色差分量/AV转换器 1路SDI进,1路DVI(可转HDMI/VGA/色差分量/AV)3.5音频1路SDI出,可以支持音频解嵌,也可把3.5音频加嵌转换输出,输出分辨率可调,支持图像翻转180度 一、产品简介 SDI转万能转…...
![](https://www.ngui.cc/images/no-images.jpg)
【设计模式】【创建型5-5】【原型模式】
文章目录 原型模式代码示例 原型模式 代码使用:spring框架里 bean的作用域 用途,以原型为模板,源源不断的创建(克隆 clone)对象。当直接创建对象的代价比较大时,则采用这种模式。 代码示例 public class…...
![](https://img-blog.csdnimg.cn/img_convert/aa96d01ce1ffcd373331a31e3640a172.png)
原子变量原理剖析
一、原子操作 原子操作保证指令以原子的方式执行,执行过程不被打断。先看一个实例,如下所示,如果thread_func_a和thread_func_b同时运行,执行完成后,i的值是多少? // test.c static int i 0;void thread…...
![](https://img-blog.csdnimg.cn/direct/900b305a1cce48078bb9c7108502c3a6.png)
WebSocket走私实践(附赠LiveGBS监控系统未授权管理员密码重置)
WebSocket走私实践(附赠LiveGBS监控系统未授权管理员密码重置) 对此,我特别感谢TryHackMe和HackTheBox academy,永远相信和追随英国TryHackMe所教导的网络安全知识,并保持学习 WebSocket走私相关的知识在这里 前段时间学习过htt…...
![](https://www.ngui.cc/images/no-images.jpg)
CentOS 7 和 CentOS Stream 8 的主要区别
更新频率: CentOS 7:传统的稳定版本,主要用于生产环境,更新频率较低,主要包含安全补丁和重要修复。CentOS Stream 8:滚动发布版本,更新更频繁,包含最新的特性和改进。它处于 Fedora …...
![](https://www.ngui.cc/images/no-images.jpg)
基于go1.19的站点模板爬虫
一、go1.19 go1.19是Go语言的一个版本,于2021年8月发布。它带来了许多新的功能和改进,包括但不限于以下方面: 并发性能改进:go1.19引入了新的调度器算法,称为“网状调度器(netlink scheduler)”,它可以更好地处理大量并发任务,在某些情况下提高了系统的并发能力。 垃…...
![](https://img-blog.csdnimg.cn/img_convert/53d0024a2e10c66d36aad7f576a24930.webp?x-oss-process=image/format,png)
(单机版)神魔大陆|v0.51.0|冰火荣耀
前言 今天给大家带来一款单机游戏的架设:神魔大陆v0.51.0:冰火荣耀。 如今市面上的资源参差不齐,大部分的都不能运行,本人亲自测试,运行视频如下: (单机版)神魔大陆 下面我将详细的教程交给大家,请耐心阅…...
![](https://img-blog.csdnimg.cn/direct/f9479052c18740bc8176d8032afe1c17.png)
k8s自动补全工具和UI管理界面
分享两个有利于K8S的工具 目录 分享两个有利于K8S的工具 一、部署Dashboard(主节点) 介绍 1.1、查看集群状态 1.2、下载yaml文件并运行Dashboard 1.3、部署服务 1.4、创建访问账户、获取token(令牌) 1.5、浏览器访问Dash…...
![](https://www.ngui.cc/images/no-images.jpg)
内网渗透:内网基础信息收集
Windows: whoami:查看当前当前主机名和登录用户名 whoami /user : 打印当前主机名和输出SID SID的最后一个数字: 1000:普通管理员 500:administrator 501:Guest 516:域控 544:域管理员 net…...
![](https://www.ngui.cc/images/no-images.jpg)
cos符号链提示是什么?TOT呢?
**关于cos符号链提示(Chain-of-Symbol Prompting, CoS)**: Chain-of-Symbol Prompting(CoS)是用于大型语言模型(LLMs)的一种新的提示方法。它旨在解决LLMs在空间场景中的理解和规划问题…...
![](https://img-blog.csdnimg.cn/direct/822bff89327249929b74d5d48297c028.jpeg#pic_center)
docker-compose部署Flink及Dinky
docker-compose部署Flink及Dinky 服务器环境:centos7 1. 配置hosts vim /etc/hostsx.x.x.x jobmanager x.x.x.x taskmanager x.x.x.x dinky-mysql2. 文件目录结构 . ├── conf │ ├── JobManager │ │ ├── flink-conf.yaml │ │ ├── log…...
![](https://img-blog.csdnimg.cn/direct/fd6880f3550848d0b9c23d3b3370e312.png)
数字时代的文化革命:Facebook的社会影响
随着数字技术的飞速发展和互联网的普及,社交网络如今已成为人们日常生活中不可或缺的一部分。在众多社交平台中,Facebook作为最大的社交网络之一,不仅连接了全球数十亿用户,更深刻影响了人们的社会互动方式、文化认同和信息传播模…...
![](https://www.ngui.cc/images/no-images.jpg)
66.前端接口调用返回400的错误
错误代码400通常表示由于无效的请求导致服务器无法处理请求。这可能是由于以下原因之一: 1.语法错误:客户端发送的请求可能存在语法错误,例如缺少必需的参数、格式不正确等。 2.未授权:如果API需要认证,而客户端没有提…...
![](https://img-blog.csdnimg.cn/direct/9e2982ae24b94fb88f0ec9679fbb9564.png)
Hadoop 安装与伪分布的搭建
目录 1 SSH免密登录 1.1 修改主机名称 1.2 修改hosts文件 1.3 创建hadoop用户 1.4 生成密钥对免密登录 2 搭建hadoop环境与jdk环境 2.1 将下载好的压缩包进行解压 2.2 编写hadoop环境变量脚本文件 2.3 修改hadoop配置文件,指定jdk路径 2.4 查看环境是否搭建完成 3 …...
![](https://www.ngui.cc/images/no-images.jpg)
网络安全:渗透测试思路.(面试)
网络安全:渗透测试思路.(面试) 渗透测试,也称为 "pen testing",是一种模拟黑客攻击的网络安全实践,目的是评估计算机系统、网络或Web应用程序的安全性. 目录: 网络安全:…...
![](https://www.ngui.cc/images/no-images.jpg)
优化堆排序
优化堆排序 堆排序是一种基于比较的排序算法,它利用堆这种数据结构来进行排序。堆是一个近似完全二叉树的结构,并同时满足堆积的性质:即子节点的键值或索引总是小于(或者大于)它的父节点。堆排序算法分为两个大的步骤:首先将待排序的序列构造成一个最大堆,此时,整个序…...
![](https://img-blog.csdnimg.cn/direct/a58ddced012646c29f47116c471d26a1.png)
vue3使用一些组件的方法
iconpark...
![](https://www.ngui.cc/images/no-images.jpg)
OceanBase 4.2.1 离线安装
OceanBase 4.2.1 离线安装 4.2 版本的OceanBase支持一键安装,所以在线版本的安装简单了很多,但在无法连接网络的情况下安装就只能手动离线安装。 注:如下安装过程都是在同一台机器上面进行,也就是只有一个节点,多个节…...
![](https://www.ngui.cc/images/no-images.jpg)
ForkJoin
线程数超过CPU核心数是没有任何意义的【因为要使用CPU密集型运算】 Fork/Join:线程池的实现,体现是分治思想,适用于能够进行任务拆分的 CPU 密集型运算,用于并行计算 任务拆分:将一个大任务拆分为算法上相同的小任务…...
![](https://img-blog.csdnimg.cn/direct/eb68f0523f524b2ab77a04bb9fae4700.png)
实验2 色彩模式转换
1. 实验目的 ①了解常用的色彩模式,理解色彩模式转换原理; ②掌握Photoshop中常用的颜色管理工具和色彩模式转换方法; ③掌握使用Matlab/PythonOpenCV编程实现色彩模式转换的方法。 2. 实验内容 ①使用Photoshop中的颜色管理工具ÿ…...
![](https://img-blog.csdnimg.cn/direct/bd6f89de0d92402db057c5d47bbbc4c8.png)
AES加密算法及AES-CMAC原理白话版系统解析
本文框架 前言1. AES加密理论1.1 不同AES算法区别1.2 加密过程介绍1.2.1 加密模式和填充方案选择1.2.2 密钥扩展1.2.3分组处理1.2.4多轮加密1.2.4.1字节替换1.2.4.2行移位1.2.4.3列混淆1.2.4.4轮密钥加1.3 加密模式1.3.1ECB模式1.3.2CBC模式1.3.3CTR模式1.3.4CFB模式1.3.5 OFB模…...
![](https://img-blog.csdnimg.cn/img_convert/bdb68d1dd13d4f1419f02beb911869fd.png)
24年hvv前夕,微步也要收费了,情报共享会在今年结束么?
一个人走的很快,但一群人才能走的更远。吉祥同学学安全https://mp.weixin.qq.com/s?__bizMzkwNjY1Mzc0Nw&mid2247483727&idx1&sndb05d8c1115a4539716eddd9fde4e5c9&scene21#wechat_redirect这个星球🔗里面已经沉淀了: 《Ja…...
![](https://img-blog.csdnimg.cn/img_convert/29251dafcd60f98174680541dcb447ed.webp?x-oss-process=image/format,png)
【地理库 Turf.js】
非常全面的地理库 , 这里枚举一些比较常用,重点的功能, 重点功能 提供地理相关的类:包括点,线,面等类。 测量功能:点到线段的距离,点和线的关系等。 判断功能: 点是否在…...
![](https://img-blog.csdnimg.cn/img_convert/ca429aa0aaac3bf9a0ec7fc9767d07c8.png)
springboot在线考试 LW +PPT+源码+讲解
第三章 系统分析 3.1 可行性分析 一个完整的系统,可行性分析是必须要有的,因为他关系到系统生存问题,对开发的意义进行分析,能否通过本系统来补充线下在线考试管理模式中的缺限,去解决其中的不足等,通过对…...
![](https://www.ngui.cc/images/no-images.jpg)
JDBC中的事务及其ACID特性
在JDBC(Java Database Connectivity)中,事务(Transaction)是指作为单个逻辑工作单元执行的一系列操作。这些操作要么全部执行,要么全部不执行,从而确保数据库的完整性和一致性。事务是现代数据库…...
![](https://img-blog.csdnimg.cn/direct/67f40c15617a410f97549a3383dd24a0.png)
Python | Leetcode Python题解之第204题计数质数
题目: 题解: MX5000000 is_prime [1] * MX is_prime[0]is_prime[1]0 for i in range(2, MX):if is_prime[i]:for j in range(i * i, MX, i):#循环每次增加iis_prime[j] 0 class Solution:def countPrimes(self, n: int) -> int:return sum(is_prim…...
![](https://img-blog.csdnimg.cn/img_convert/194a44e65b3fd392d0da625207d6f090.png)
【课程总结】Day10:卷积网络的基本组件
前言 由于接下来的课程内容将围绕计算机视觉展开,其中接触最多的内容是卷积、卷积神经网络等…因此,本篇内容将从卷积入手,梳理理解:卷积的意义、卷积在图像处理中的作用以及卷积神经网络的概念,最后利用pytorch搭建一…...
![](https://img-blog.csdnimg.cn/ac49fbc00ad24b8c8e81cb5dc58ba4fe.gif#pic_center)
ModuleNotFoundError: No module named ‘_sysconfigdata_x86_64_conda_linux_gnu‘
ModuleNotFoundError: No module named _sysconfigdata_x86_64_conda_linux_gnu 1.软件环境⚙️2.问题描述🔍3.解决方法🐡4.结果预览🤔 1.软件环境⚙️ Ubuntu 20.04 Python 3.7.0 2.问题描述🔍 今天发现更新conda之后࿰…...
![](https://img-blog.csdnimg.cn/direct/2ee90d3cd62d4832a0fe316ec3ef9f61.png)
【物联网】室内定位技术及定位方式简介
目录 一、概述 二、常用的室内定位技术 2.1 WIFI技术 2.2 UWB超宽带 2.3 蓝牙BLE 2.4 ZigBee技术 2.5 RFID技术 三、常用的室内定位方式 3.1 信号到达时间 3.2 信号到达时间差 3.3 信号到达角 3.4 接收信号强度 一、概述 GPS是目前应用最广泛的定位技术࿰…...
![](https://img-blog.csdnimg.cn/img_convert/acd306aae60fe83bf7fd1f7692ce7234.jpeg)
Leetcode[反转链表]
LCR 024. 反转链表 给定单链表的头节点 head ,请反转链表,并返回反转后的链表的头节点。 示例 1: 输入:head [1,2,3,4,5] 输出:[5,4,3,2,1]示例 2: 输入:head [1,2] 输出:[2,1]示…...
![](https://www.ngui.cc/images/no-images.jpg)
【差分数组】个人练习-Leetcode-2249. Count Lattice Points Inside a Circle
题目链接:https://leetcode.cn/problems/count-lattice-points-inside-a-circle/description/ 题目大意:给出一系列圆的圆心坐标和半径,求在这些圆内部(边缘也算)的格点的数量。 思路:简单的思路就是暴力…...
![](https://img-blog.csdnimg.cn/direct/c872039e11e34d0e8925a8cb235bd000.png)
【JavaEE】Cookie和Session详解
一.Cookie 首先我们知道HTTP协议本身是’‘无状态’‘的, 这里的’‘无状态’指的是:默认情况下HTTP协议的客户端和服务器之间的这次通信,和下次通信之间没有直接的联系. 但是在实际的开发过程之中, 我们很多时候是需要知道请求之间的关联关系的. 例如登陆网站成功后,第二次访…...
![](https://www.ngui.cc/images/no-images.jpg)
uniapp canvas vue3 ts实例
<template><view><canvas canvas-idcanvas-test class"canvas-test"></canvas></view> </template><script setup lang"ts">//封装的jsimport libs from /libs;//重点引入的import type { ComponentInternalIns…...
![](https://www.ngui.cc/images/no-images.jpg)
网络构建关键技术_3.SDN技术
SDN网络在控制平面和转发平面分别采用了不同技术,以满足SDN网络控件的全局性和灵活性,业务转发的高效性及高性价比要求。主要关键技术包括:控制平面技术、数据平面技术和转发规则一致性更新技术等。 1.控制平面技术 控制器是控制平面核心部件…...
![](https://img-blog.csdnimg.cn/direct/1609247a08174de7809e26b9cb58692a.png)
【高性能服务器】单进程服务器
🔥博客主页: 我要成为C领域大神🎥系列专栏:【C核心编程】 【计算机网络】 【Linux编程】 【操作系统】 ❤️感谢大家点赞👍收藏⭐评论✍️ 本博客致力于知识分享,与更多的人进行学习交流 单进程服务器 …...
![](https://img-blog.csdnimg.cn/direct/0122203cccf64da1893e8b923c3cb332.png)
任意密码重置漏洞
文章目录 1. 任意密码重置漏洞原理2. 任意密码重置漏洞产生原因3. 任意密码重置漏洞场景3.1 验证码爆破3.2 验证凭证回传3.3 验证凭证未绑是用户3.4 跳过验证步骤3.5 凭证可预测3.6 同时向多个账户发送凭证 4. 任意密码重置经典案例4.1 中国人寿某重要系统任意账户密码重置4.2 …...
![](https://i-blog.csdnimg.cn/direct/490586dfd90644b8bdda7b9dd4c058b3.png#pic_center)
【JavaEE精炼宝库】文件操作(1)——基本知识 | 操作文件——打开实用性编程的大门
目录 一、文件的基本知识1.1 文件的基本概念:1.2 树型结构组织和目录:1.3 文件路径(Path):1.4 二进制文件 VS 文本文件:1.5 其它: 二、Java 操作文件2.1 方法说明:2.2 使用演示&…...
![](https://i-blog.csdnimg.cn/direct/63558f53ee094949a7218e0726595f9b.png)
nuxt、vue树形图d3.js
直接上代码 //安装 npm i d3 --save<template><div class"d3"><div :id"id" class"d3-content"></div></div> </template> <script> import * as d3 from "d3";export default {props: {d…...
![](https://img-blog.csdnimg.cn/img_convert/831cdcd74ad20372c2d8731f41d3e579.gif)
嵌入式UI开发-lvgl+wsl2+vscode系列:7、滚动(Scrolling)
一、前言 lvgl的教程中将滚动单独放出来做了介绍,可能确实由于嵌入式设备显示屏较小,出现需要滚动的情况比较多,所以滚动也就显得比较重要。 二、示例 1、示例1(自动出现滚动) #include "../lv_examples.h&qu…...
![](https://img-blog.csdnimg.cn/direct/c61a50f4955e4d518965e670e83269b4.png)
[C++][设计模式][访问器]详细讲解
目录 1.动机2.模式定义3.要点总结4.代码感受1.代码一2.代码二 1.动机 在软件构件过程中,由于需求的变化,某些类层次结构中常常需要增加新的行为(方法),如果直接在基类中做这样的更改, 将会给子类带来很繁重的变更负担,…...
![](https://img-blog.csdnimg.cn/direct/7114449873204f3587112c21379dab92.png)
探索工业AI智能摄像机的高端科技
在当今快速发展的工业智能化领域,工业AI智能摄像机系列以其卓越的性能和多功能性在国内外备受关注(文末有国外工程师的评测链接)。搭载Raspberry Pi CM4支持的旨在广泛应用,涵盖从简单的条形码扫描到基于人工智能的工业环境中的缺…...
![](https://www.ngui.cc/images/no-images.jpg)
Java 基础查漏补缺
1.深入解读:JDK与JRE的区别 JDK提供了完整的Java开发工具和资源,包括编译器、调试器和其他开发工具,满足开发人员的各种需求。 JRE则相对更为基础,它只提供了Java程序运行所需的环境,包含了Java虚拟机(JVM&…...
![](https://www.ngui.cc/images/no-images.jpg)
雪铁龙全新SUV上市!车身尺寸升级,内饰全面翻新,好看吗
雪铁龙全新C3 Aircross日前在海外市场正式上市,售价区间为19,400-27,400欧元,目前已开启新车订购工作。同时,新车也有望在后期引入国内市场销售,以进一步丰富雪铁龙在华产品序列,同级别主要竞争对手包含了本田XR-V、领克06、比亚迪元UP等车型。雪铁龙全新C3 Aircross车型车…...
![](https://img-home.csdnimg.cn/images/20230724024159.png?origin_url=..%2Fmedia%2Fac-1-2-dele.png&pos_id=img-GM50CDTZ-1716990653964)
什么是访问控制漏洞
什么是AC Bugs? 实验室 Vertical privilege escalation 仅通过隐藏目录/判断参数来权限控制是不安全的(爆破url/爬虫/robots.txt/Fuzz/jsfinder) Unprotected functionality 访问robots.txt 得到隐藏目录,访问目录 ,…...
![](https://www.ngui.cc/images/no-images.jpg)
python -【三】循环语句
循环语句 一、while 循环 while 语法 while 条件: 条件满足时,做事情 a 0 while a < 100:print(i like python ...)a 1求 1-100 的总和 i 1 sum 0 while i < 100:sum ii 1 print(f1-100 的和是 {sum})""" 1-100 的和是 5050 &qu…...
![](https://img-blog.csdnimg.cn/direct/8a1acea34c8640d7b609f242d3edc5d3.png)
内存函数<C语言>
前言 前面两篇文章介绍了字符串函数,不过它们都只能用来处理字符串,C语言中也内置了一些内存函数来对不同类型的数据进行处理,本文将介绍:memcpy()使用以及模拟实现,memmove()使用以及模拟实现,memset()使用…...
![](https://www.ngui.cc/images/no-images.jpg)
用Spring Security快速实现 RABC模型案例
RABC模型通常是指“基于角色的访问控制”(Role-Based Access Control,RBAC)模型。这是一种广泛使用的访问控制机制,用于限制用户或系统对计算机或网络资源的访问。在RBAC模型中,权限与角色相关联,用户通过分…...
![](https://img-blog.csdnimg.cn/direct/64b3e3b0de324affb1a10df95e1d9e7b.png)
嵌入式单片机笔试题
DC-DC 和 LDO两者有何区别? DC-DC转换器(直流-直流转换器)和LDO(低压差线性稳压器)都是用于电源管理的设备,但它们在原理和特性上有一些显著的区别: 原理: DC-DC转换器通过改变输…...