Qt_显示类控件

目录

一、QLabel

1、QLabel属性介绍

2、textFormat文本格式

3、pixmap标签图片

3.1 resizeEvent 

4、QFrame边框

5、alignment文本对齐

6、wordWrap自动换行

7、indent设置缩进

8、margin设置边距 

9、buddy设置伙伴

二、QLCDNumber

1、QLCDNumber属性介绍

2、实现QLCDNumber倒计时功能

三、QProgressbar

1、QProgressbar属性介绍

2、实现自动增长的进度条

3、设置进度条的颜色 

四、QCalendarWidget

1、QCalendarWidget属性介绍 

2、代码测试

结语 


前言:

        在Qt中,显示类控件通常是给用户传递一些文本信息或图片信息,以达到和用户交互的目的。虽然显示类控件的作用看起来如此简单,但是其拥有各式各样的属性,并且细节很多,所以在进行设计显示类控件时需要特别注意。

一、QLabel

1、QLabel属性介绍

         QLabel是显示类控件中最为经典的控件,他表示标签的意思,一般情况下不可被鼠标或者键盘选中,单纯的向用户展示某些信息,属性介绍如下:

text

表示QLabel中的文本内容

textFormat

表示QLabel中的文本格式,有以下四种:

• Qt::PlainText 纯文本

• Qt::RichText 富文本(⽀持 html 标签)

• Qt::MarkdownText markdown 格式

• Qt::AutoText 根据文本内容自动决定文本格式

pixmap

表示QLabel中的图片内容

scaledContents

设置为true,会自动根据窗口比例拉伸QLabel的内容,设置为false则不会
alignment
设置⽔平和垂直方向的对齐
wordWrap
设置为true,则内部的⽂本会⾃动换行,设置为false则不会
indent
设置⽂本缩进,文本内容的开头和左边框的距离
margin
设置⽂本和边框之间的边距(包括上下左右四个边框)
openExternalLinks
是否允许打开⼀个外部的链接
buddy
给QLabel关联⼀个 "伙伴" ,触发QLabel时就能激活对应的伙伴

        也可以在ui文件中的右下角里的属性栏中看到QLabel的相关属性:

2、textFormat文本格式

         使用函数setTextFormat就可以对QLabel控件中的文本进行格式设置,设置完成后,该控件的文本就支持对应格式的插件,具体实现如下。

        ①选创建三个QLabel控件,然后对这三个控件赋予不同的textFormat,分别是PlainText 、RichText 、MarkdownTex,观察使用文本插件的效果:

        ②更改widget.cpp中的代码,观察运行结果:

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);ui->label->setTextFormat(Qt::PlainText);ui->label->setText("<b> 这是纯文本 </b>");//纯文本不支持html的标签ui->label_2->setTextFormat(Qt::RichText);ui->label_2->setText("<b> 这是富文本 </b>");//<b>和</b>是富文本(即html的标签)ui->label_3->setTextFormat(Qt::MarkdownText);ui->label_3->setText("# 这是markdown文本");//#是MarkdownText独有的规则
}Widget::~Widget()
{delete ui;
}

         运行结果:

         从结果可以看到,不同的格式有着不同的规则,所打印出来的文本格式也就不一样,这就是textFormat的作用。

3、pixmap标签图片

         pixmap表示标签内的图片内容,可以通过setPixmap函数将图片设置到对应的标签里,所以得有一个图片资源,并且可以在代码中找到该图片资源的路径,通常会将该图片放到qrc文件下(qrc相关概念见QWidget属性介绍)。

        现在将该图片覆盖至整个窗口界面,首先先设置一个label作为载体,将label覆盖整个窗口界面,然后把图片覆盖整个label,以达到将图片覆盖整个窗口界面的效果。修改widget.cpp文件的代码如下:

#include "widget.h"
#include "ui_widget.h"#include <QLabel>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);QRect windows = this->geometry();//拿到窗口的尺寸QLabel* ql = new QLabel(this);ql->setGeometry(windows);QPixmap p(":/shoe.png");ql->setPixmap(p);//将图片设置进label中//此时图片的大小是固定的,为了让图片填满整个label,要对图片进行拉伸ql->setScaledContents(true);
}Widget::~Widget()
{delete ui;
}

        运行结果:

3.1 resizeEvent 

        题外话:此时图片虽然覆盖了整个窗口界面,但是当我们放大或缩小这个窗口时,里面的图片并不会随着窗口的尺寸变动而调整。为了实现图片自动调整尺寸的功能,我们需要明白当窗口大小变化时,Qt会生成一个QresizeEvent的事件,进而自动调用resizeEvent虚函数,这里采取的多态的思想。因此我们只要重写resizeEvent函数,则每次放大或缩小窗口时都会调用我们重写后的实现。

        resizeEvent函数的介绍如下:

void resizeEvent(QResizeEvent *event);
//event包含了该事件生成时,当前窗口的尺寸

        在widget.h文件中重写resizeEvent虚函数(此时的代码逻辑较上述代码要变更一下,因为重写的resizeEvent函数里面要用到标签对象ql,所以要将ql放到一个全局可见的地方,方便让resizeEvent可以拿到他):

#ifndef WIDGET_H
#define WIDGET_H#include <QWidget>
#include <QLabel>
#include <QResizeEvent>QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACEclass Widget : public QWidget
{Q_OBJECTpublic:Widget(QWidget *parent = nullptr);~Widget();void resizeEvent(QResizeEvent *event){ql->setGeometry(0,0,event->size().width(),event->size().height());}private:Ui::Widget *ui;QLabel* ql;
};
#endif // WIDGET_H

        运行结果:

4、QFrame边框

         QLabel继承自QFrame,而QFrame又继承QWidget。QFrame提供控件的边框样式,允许对QLabel的边框进行设置。可以在ui文件中右下角的属性栏看到QFrame,如下图:

        其中frameShape表示边框的样式,frameShadow表示边框阴影,lineWidth和midLineWidth表示边框宽度。其中frameShape用的是最多的,他可设置的样式如下:

QFrame::Box :矩形边框
QFrame::Panel :带有可点击区域的⾯板边框
QFrame::WinPanel :Windows⻛格的边框
QFrame::HLine :⽔平线边框
QFrame::VLine :垂直线边框
QFrame::StyledPanel :带有可点击区域的⾯板边框,但样式取决于窗⼝主题

5、alignment文本对齐

         通过调用函数setAlignment,来使控件内的文本进行对齐,具体的对齐方式有如下几种:

AlignHCenter:水平居中对齐

• AlignVCenter:垂直居中对齐

• AlignTop:和顶层边框对齐

• AlignLeft:和左边框对齐

• AlignRight:和右边框对齐

• AlignBottom:和底层边框对齐

        测试水平居中和垂直居中对齐的代码如下:

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);ui->label->setAlignment(Qt::AlignHCenter|Qt::AlignVCenter);ui->label->setText("这是一个普通文本");
}Widget::~Widget()
{delete ui;
}

         运行结果:

6、wordWrap自动换行

        调用函数setWordWrap可以让QLabel控件里文本实现自动换行效果,代码如下:

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);//ui->label->setAlignment(Qt::AlignHCenter|Qt::AlignVCenter);ui->label->setWordWrap(true);ui->label->setText("这是一个普通文本这是一个普通文本这是一个""普通文本这是一个普通文本这是一个普通文本这是一个普通文本");
}Widget::~Widget()
{delete ui;
}

         运行结果:

7、indent设置缩进

         调用函数setIndent设置QLabel中文本的缩进,代码如下:

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);ui->label->setIndent(20);ui->label->setText("这是一个普通文本这是一个普通文本这是一个""普通文本这是一个普通文本这是一个普通文本这是一个普通文本");
}Widget::~Widget()
{delete ui;
}

        运行结果:

8、margin设置边距 

        调用函数setMargin可以设置QLabel文本的四周边框的边距,由于QLabel控件默认是左边框对齐和垂直对齐的,不方便观察边距的效果,因此将QLabel控件定义成仅仅是左边框对齐,方便边距的效果。代码如下:

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);ui->label->setAlignment(Qt::AlignLeft);ui->label->setMargin(30);ui->label->setText("这是一个普通文本这是一个普通文本这是一个""普通文本这是一个普通文本这是一个普通文本这是一个普通文本");
}Widget::~Widget()
{delete ui;
}

        运行结果:

9、buddy设置伙伴

        调用函数setBuddy来为QLabel设置一个伙伴,当触发QLabel时就能激活这个伙伴,他们类似于一种绑定关系,比如为QLabel设置一个按钮伙伴,当触发QLabel时这个按钮就会被选中。

        为了方便测试,可以在标签的文本中显示写出&a,作用是通过文本内容绑定alt+a快捷键,目的是通过alt+a的方式来触发QLabel,直接在ui文件中以拖拽控件的方式生成界面:

        分别给以上两个label控件设置两个对应的伙伴,代码如下:

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);ui->label->setBuddy(ui->radioButton);ui->label_2->setBuddy(ui->radioButton_2);
}Widget::~Widget()
{delete ui;
}

         运行结果不方便用截图表现出来,具体的效果是当按下alt+a时,对应的按钮就会被选中。

二、QLCDNumber

1、QLCDNumber属性介绍

        QLCDNumber也是一个显示类控件,跟QLabel不同的是,QLCDNumber专门用于显示数字信息,和老式计算器的屏幕有些相似。

        QLCDNumber的属性如下:

value
可以通过设置他从而设置控件上显示的数字值,可以是小数也可以是整数,value会根据intValue的值变化而变化。
intValue
也可以通过设置他从而设置控件上显示的数字值,只能表示整数。当value是小数时,intValue也会自动根据value的值进行四舍五入取到整数。
digitCount
表示控件可以显示出几位数
mode
表示控件上数字的显示形式,比如:二进制、十进制....
segmentStyle
表示控件上数字的风格
smallDecimalPoint
设置控件上小数点的格式,比如字体间距和小数点的位置

2、实现QLCDNumber倒计时功能

        让QLCDNumber控件显示的数值自动减少,就如同一个倒计时,但是要实现这个功能,并不是依靠sleep函数,因为如果在widget构造函数中使用循环+sleep函数,则无法实现倒计时功能,因为界面的生成是在构造函数之后的,界面无法捕捉这个循环过程。并且Qt禁止用户创建线程对界面做修改,所以需要先创建一个定时器,这个定时器每过一段时间就会发出timeout信号,我们自定义一个槽函数然后连接这个信号,并且在槽函数中对QLCDNumber的数值进行减减操作。因此,整体的逻辑是依靠定时器发出的信号,从而间接的对QLCDNumber的数值进行减减

        widget.h代码如下:

#ifndef WIDGET_H
#define WIDGET_H#include <QWidget>QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACEclass Widget : public QWidget
{Q_OBJECTpublic:Widget(QWidget *parent = nullptr);~Widget();void timeSlot();//QTimer的槽函数private:Ui::Widget *ui;QTimer* time;
};
#endif // WIDGET_H

        widget.cpp代码:

#include "widget.h"
#include "ui_widget.h"
#include <QTimer>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);ui->lcdNumber->display(10);//设置计时器的数值为10//创建一个定时器time = new QTimer(this);time->start(1000);//每过一秒,该定时器发出一个信号connect(time,&QTimer::timeout,this,&Widget::timeSlot);
}Widget::~Widget()
{delete ui;
}void Widget::timeSlot()
{int num = ui->lcdNumber->value();if(num==0){time->stop();return;}num--;ui->lcdNumber->display(num);
}

        运行结果:

三、QProgressbar

1、QProgressbar属性介绍

         QProgressbar表示进度条,样式如下:

       属性介绍如下:

minimum
进度条最⼩值
maximum
进度条最大值
value
进度条当前值
alignment
数值在进度条中的对齐方式
textVisible
进度条数值是否可见
orientation
进度条的⽅向是⽔平还是垂直
invertAppearance
进度条是否是朝反⽅向增⻓进度
textDirection
⽂本的朝向
format
数值的格式

2、实现自动增长的进度条

         核心也是调用QTimer计时器来间接完成进度条的增长,实现逻辑和上述倒计时的例子是一样的,widget.h代码如下:

#ifndef WIDGET_H
#define WIDGET_H#include <QWidget>QT_BEGIN_NAMESPACE
namespace Ui { class Widget; }
QT_END_NAMESPACEclass Widget : public QWidget
{Q_OBJECTpublic:Widget(QWidget *parent = nullptr);~Widget();void progressbar();private:Ui::Widget *ui;QTimer* time;
};
#endif // WIDGET_H

        widget.cpp的代码如下:

#include "widget.h"
#include "ui_widget.h"
#include <QTimer>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);time = new QTimer(this);ui->progressBar->setValue(0);time->start(100);connect(time,&QTimer::timeout,this,&Widget::progressbar);
}Widget::~Widget()
{delete ui;
}void Widget::progressbar()
{int num = ui->progressBar->value();if(num==100){time->stop();return;}ui->progressBar->setValue(num+1);
}

        运行结果:

3、设置进度条的颜色 

        由于QProgressbar也是间接继承自QWidget,因此QWidget的属性styleSheer也是可以使用的,并且可以通过styleSheer更改进度条的颜色,代码如下:

#include "widget.h"
#include "ui_widget.h"
#include <QTimer>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);time = new QTimer(this);ui->progressBar->setValue(0);//设置进度条初始值//这里要加上QProgressBar::chunk,表示选中进度条的进度块ui->progressBar->setStyleSheet("QProgressBar::chunk{background-color:red;}");ui->progressBar->setAlignment(Qt::AlignHCenter|Qt::AlignVCenter);//设置数值的对齐方式time->start(100);//一秒发出10个timeout信号connect(time,&QTimer::timeout,this,&Widget::progressbar);
}Widget::~Widget()
{delete ui;
}void Widget::progressbar()
{int num = ui->progressBar->value();if(num==100){time->stop();return;}ui->progressBar->setValue(num+1);
}

        运行结果:

        只不过这里有一个小bug,就是更改颜色后,数值会自动偏离,因此需要我们手动将数值的对齐方式再次进行设置。 

四、QCalendarWidget

1、QCalendarWidget属性介绍 

        QCalendarWidget表示日历,并且该控件只能用来表示日历,该控件样式如下:

        属性介绍:

selectDate
当前选中的⽇期
minimumDate
日历中的最小日期范围
maximumDate
日历中的最大日期范围
firstDayOfWeek
每周的第⼀天(也就是⽇历的第⼀列) 是周几
gridVisible
是否显示日历的边框
selectionMode
是否允许选择日期
navigationBarVisible
⽇历上⽅标题是否显示
horizontalHeaderFormat
日历第一行的表现格式
verticalHeaderFormat
日历第一列是否显示出来
dateEditEnabled
是否允许⽇期被编辑

        值得注意的是,该日历控件再选中其内容时,或者对日历进行操作时会发出相关信号,具体信号如下:

selectionChanged()
当选中的日期发⽣改变时发出
activated(const QDate&)
当双击⼀个有效的日期或者按下回⻋键时发出,并把该日期保存在QData中
currentPageChanged(int, int)
当年份⽉份改变时发出,形参表示改变后的新年份和⽉份

2、代码测试

        测试selectionChanged信号,即点击日历中的某一天后触发该信号,然后在自定义槽函数里打印当前选中的具体日期,并将该日期展示到界面上,ui文件中的界面设计如下:

        widget.cpp文件的代码如下:

#include "widget.h"
#include "ui_widget.h"
#include <QDebug>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);
}Widget::~Widget()
{delete ui;
}void Widget::on_calendarWidget_selectionChanged()//selectionChanged信号的槽函数
{QDate date = ui->calendarWidget->selectedDate();qDebug()<<date;ui->label->setText("选中的日期:"+date.toString());
}

        运行结果:

结语 

        以上就是关于Qt中显示类控件的讲解,Qt中还有其他的显示类控件,但是基本大同小异,掌握好一些常用的控件,理解别的控件也就容易许多。每一种显示类控件都会有属于自己独特的属性,当然,也会有相似的属性,只不过属性的名称不一样。

        最后如果本文有遗漏或者有误的地方欢迎大家在评论区补充,谢谢大家!!    

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SSM网上书店管理系统---附源码72542

目 录 摘要 1 绪论 1.1 研究背景及意义 1.2国内外研究现状 1.3系统开发的目标 1.4论文结构与章节安排 2 网上书店管理系统系统分析 2.1 可行性分析 2.1.1 技术可行性分析 2.1.2 经济可行性分析 2.1.3 操作可行性分析 2.2 系统功能分析 2.2.1 功能性分析 2.2.2 非…

【在Linux世界中追寻伟大的One Piece】网络命令|验证UDP

目录 1 -> Ping命令 2 -> Netstat命令 3 -> Pidof命令 4 -> 验证UDP-Windows作为client访问Linux 4.1 -> UDP client样例 1 -> Ping命令 Ping命令是一种网络诊断工具&#xff0c;它使用ICMP(Internet Control Message Protocol&#xff0c;互联网控制消…

音视频开发常见的开源项目汇总

FFmpeg 地址&#xff1a;https://ffmpeg.org/介绍&#xff1a;FFmpeg 是一个非常强大的开源多媒体框架&#xff0c;它可以用来处理视频和音频文件。它支持多种格式的转换、编码、解码、转码、流处理等。FFmpeg 包括了 libavformat、libavcodec、libavutil、libswscale、libpos…

数据结构基础讲解(八)——树和二叉树专项练习(上)

本文数据结构讲解参考书目&#xff1a; 通过网盘分享的文件&#xff1a;数据结构 C语言版.pdf 链接: https://pan.baidu.com/s/159y_QTbXqpMhNCNP_Fls9g?pwdze8e 提取码: ze8e 数据结构基础讲解&#xff08;七&#xff09;——数组和广义表专项练习-CSDN博客 个人主页&#x…

IDEA 常用配置和开发插件

件市场中搜索并安装“Git Integration”插件。 一、前言 在本篇文章中我会为大家总结一些我自己常用的配置和开发插件&#xff0c;此外也给大家提供一个建议&#xff0c;可以根据自己的项目需求和个人偏好选择适合的插件。另外&#xff0c;IDEA 也在不断更新&#xff0c;可能会…

C++进阶 二叉搜索树的讲解

二叉搜索树的概念 二叉搜索树又称为二叉排序树。 二叉搜索树的性质 若它的左子树不为空&#xff0c;则左子树上所有结点的值都小于等于根结点的值若它的右子树不为空&#xff0c;则右子树上所有结点的值都大于等于根结点的值它的左右子树也分别为二叉搜索树二叉搜索树中可以支持…

Geneformer AI 模型,有限数据也能解锁基因网络

目录 类似于 BERT 的单单元数据参考模型 NVIDIA Clara 工具组合用于药物研发 用于疾病建模的基础 AI 模型 Geneformer 是最近推出的 和功能强大的 AI 模型&#xff0c;可以通过从大量单细胞转录组数据中进行迁移学习来学习基因网络动力学和相互作用。借助此工具&#xff0c;…

尚品汇-订单拆单、支付宝关闭交易、关闭过期订单整合(五十)

目录&#xff1a; &#xff08;1&#xff09;拆单接口 &#xff08;2&#xff09;取消订单业务补充关闭支付记录 &#xff08;3&#xff09;支付宝关闭交易 &#xff08;4&#xff09;查询支付交易记录 &#xff08;5&#xff09;PaymentFeignClient 远程接口 &#xff08…

探索Python轻量级数据库:TinyDB的奇妙之旅

文章目录 探索Python轻量级数据库&#xff1a;TinyDB的奇妙之旅背景&#xff1a;为何选择TinyDB&#xff1f;什么是TinyDB&#xff1f;如何安装TinyDB&#xff1f;简单库函数使用方法场景应用常见Bug及解决方案总结 探索Python轻量级数据库&#xff1a;TinyDB的奇妙之旅 背景&…

Redis入门2

在java中操作Redis Redis的Java客户端 Redis 的 Java 客户端很多&#xff0c;常用的几种: Jedis Lettuce Spring Data Redis Spring Data Redis 是 Spring 的一部分&#xff0c;对 Redis 底层开发包进行了高度封装。 在 Spring 项目中&#xff0c;可以使用Spring Data R…

Vue介绍、窗体内操作、窗体间操作学习

系列文章目录 第一章 基础知识、数据类型学习 第二章 万年历项目 第三章 代码逻辑训练习题 第四章 方法、数组学习 第五章 图书管理系统项目 第六章 面向对象编程&#xff1a;封装、继承、多态学习 第七章 封装继承多态习题 第八章 常用类、包装类、异常处理机制学习 第九章 集…

【Linux】Ubuntu 22.04 shell实现MySQL5.7 tar 一键安装

参考 https://blog.csdn.net/qq_35995514/article/details/134350572?spm1001.2014.3001.5501 源文章是centos 的 教程&#xff0c;这里为了大家的方便&#xff0c;再原作者基础上做了修改&#xff0c;记录了ubuntu的22.04的我的配置&#xff0c;加了一个删除原有mysql 的脚本…

【诉讼流程-健身房-违约认定-私教课-诉讼书前提材料整理-民事诉讼-自我学习-铺平通往法律的阶梯-讲解(2)】

【诉讼流程-健身房-违约-私教课-前期法律流程-民事诉讼-自我学习-铺平通往法律的阶梯-讲解&#xff08;2&#xff09;】 &#xff08;1&#xff09;前言说明1、目的2、一个小测试1、更换原教练2、频繁更换教练3、上课估计拖课&#xff0c;占用上课时间&#xff0c;抽烟等。4、以…

Python计算机视觉 第10章-OpenCV

Python计算机视觉 第10章-OpenCV OpenCV 是一个C 库&#xff0c;用于&#xff08;实时&#xff09;处理计算视觉问题。实时处理计算机视觉的 C 库&#xff0c;最初由英特尔公司开发&#xff0c;现由 Willow Garage 维护。OpenCV 是在 BSD 许可下发布的开源库&#xff0c;这意味…

2024/9/11学校教的响应式前端能学到什么?

9.11 1&#xff09;砌砖 确定整体框架&#xff0c;而不是想到一点写一点&#xff0c;类似盖大楼&#xff0c;不是想到哪盖到哪&#xff0c;先砌砖&#xff0c;再装修 砌砖前先划分好砌砖范围(初始化样式) 清除body自带的内外边距 * { margin: 0; padding: 0; }去掉li的小圆点…

【新片场-注册安全分析报告-无验证方式导致安全隐患】

前言 由于网站注册入口容易被黑客攻击&#xff0c;存在如下安全问题&#xff1a; 1. 暴力破解密码&#xff0c;造成用户信息泄露 2. 短信盗刷的安全问题&#xff0c;影响业务及导致用户投诉 3. 带来经济损失&#xff0c;尤其是后付费客户&#xff0c;风险巨大&#xff0c;造…

微信小程序开发第三课

1 wxml语法 1.1 模版语法 # 1 在页面 xx.js 的 Page() 方法的 data 对象中进行声明定义 # 2 在xx.wxml 中使用 {{}} 包裹&#xff0c;显示数据 # 3 可以显示如下&#xff0c;不能编写js语句或js方法-变量-算数运算-三元运算-逻辑判断# 4 只是单纯通过赋值&#xff0c;js中…

快速生成服务器响应json-server的安装和使用

json-server介绍地址:https://www.geeksforgeeks.org/json-server-setup-and-introduction/ 1.json-server是什么? 基于自定义的json文件,快速生成服务端响应,可用于前端调试接口 2.安装和卸载json-server 2.1 安装: 使用npm命令: npm install -g json-server 2.2 卸载 npm …

工厂方法模式和抽象工厂模式

工厂方法模式 一个工厂只能创建一种产品 工厂方法模式的结构 工厂方法模式包含以下4个角色 Product&#xff08;抽象产品&#xff09; ConcreteProduct&#xff08;具体产品&#xff09; Factory&#xff08;抽象工厂&#xff09; ConcreteFactory&#xff08;具体工厂…

(论文解读)Visual-Language Prompt Tuning with Knowledge-guided Context Optimization

Comment: accepted by CVPR2023 基于知识引导上下文优化的视觉语言提示学习 摘要 提示调优是利用任务相关的可学习标记将预训练的视觉语言模型&#xff08;VLM&#xff09;适应下游任务的有效方法。基于CoOp的代表性的工作将可学习的文本token与类别token相结合&#xff0c;…