Qt Quick系列(6)—动画

news2024/11/16 13:38:10

🚀作者:CAccept
🎂专栏:Qt Quick
在这里插入图片描述

文章目录

  • 前言
  • 1、简单动画
    • 代码示例
  • 2、应用动画
    • 代码示例
    • 相关知识点
  • 3、缓动曲线
    • 代码示例
    • 相关知识点
  • 4、动画分组
    • 代码示例
  • 5、嵌套动画
    • 代码示例
  • 6、状态转换
    • 代码示例
    • 相关知识点
  • 结语

前言

欢迎来到Qt Quick系列的第六篇!在前几篇教程中,我们已经学习了Qt Quick的基础知识和常用控件的使用方法。本篇博客将带领你进入Qt Quick动画的世界,探索如何使用动画来提升应用程序的用户体验和视觉吸引力。
动画是现代应用程序中重要的交互元素,它能够为用户提供流畅、生动的界面效果,使应用程序更具吸引力。Qt Quick提供了强大的动画框架,使得创建各种动画效果变得简单而灵活。
在本篇教程中,我们将学习如何使用Qt Quick的动画组件,包括属性动画、过渡动画和关键帧动画等。我们将了解动画的基本概念、属性插值和缓动函数的应用,以及如何结合Qt Quick的控件和状态机来实现更复杂的动画效果。
无论你是想为应用程序添加简单的过渡效果,还是想创建复杂的动画序列,本篇教程都将为你提供详细的指导和实例代码。希望通过学习本文,你能够掌握Qt Quick动画的核心概念和技巧,并能够运用它们在你的应用程序中创造出令人惊艳的动态效果。


1、简单动画

我们要知道动画的几个基础的元素或者说是一些参数,现在我们来认识一下它们吧
常用的动画类型元素动画:

  • PropertyAnimation:属性值改变播放动画
  • NumberAnimation:qreal-type值改变播放动画
  • ColorAnimation: 颜色值改变播放动画
  • RotationAnimation: 旋转值改变播放的动画

动画中的基本元素

  • to:终点的位置
  • duration:到终点的耗时
  • running:是否开始(false/true)

代码示例

import QtQuick 2.9
import QtQuick.Window 2.3

Image
{
    id:root
    source:"../images/background.png"
    width: 1000
    height: 800
    property int padding: 40
    //通过root下的running来决定是否运行,避免没计算完全就开始动画
    property bool running: false
    Image
    {
        id:panda
        source:"../images/qq.png"
        x:root.padding;y:(root.height-height)/2
        //改变x位置
        NumberAnimation on x{
            //对x的移动,移动到root.width-panda.width
            to:root.width-panda.width
            //耗时3秒到
            duration:3000
            //别直接true,因为我们这个移动涉及到计算,
            //如果直接true的话,可能还没开始计算就开始移动,这样会有问题
            running:root.running
        }
        //翻转
        RotationAnimation on rotation {
            to:360
            duration: 3000
            running:root.running
        }
        //改变透明度
        PropertyAnimation on opacity{
            to:0
            duration:3000
            running:root.running
        }

    }


    MouseArea
    {
        anchors.fill:parent
        onClicked: root.running=true
    }

}

运行效果:
在这里插入图片描述


2、应用动画

可以通过多种方式执行动画:

  • 属性上的动画:在元素完全加载后自动运行
  • 属性上的行为:属性值更改时自动运行Behavior
  • 独立动画:使用start()显式启动动画或将running设置为true时运行

代码示例

现在我们设计一个界面,里面有三张图片,而第一张和第二张实现的效果都是点击图片以后会开始向上移动,只是实现的方法不同,而第三张图片也是通过点击以后图片就会往上移动,但是再次点击的时候图片就又回重新回到原点再次向上运动
实现步骤:
1、创建一个componen名字叫CliableImageV2,里面是对于图片的一些通用设计(包括文字以及点击信号的设置)
2、在main文件中调用3次CliableImageV2组件生成3个图片并对动画方式进行设计
CliableImageV2.qml

import QtQuick 2.0

Item {
    id:root
    width: containter.childrenRect.width
    height: containter.childrenRect.height
    //取别名,这样是为了外部更方便对内部元素进行访问和设置
    property alias text: label.text
    property alias source: image.source
    signal clicked
    Column{
        id:containter
        Image
        {
            id:image
        }
        Text
        {
            id:label
            width:image.width
            //超过宽度就会自动换行
            wrapMode:Text.WordWrap
            //水平居中
            horizontalAlignment:Text.AlignHCenter
            color:"#ececec"
        }
    }

    MouseArea
    {
        anchors.fill:parent
        onClicked: root.clicked()
    }
}

main.qml

import QtQuick 2.9
import QtQuick.Window 2.3

Window {
    id:root
    visible: true
    width: 640
    height: 480
    title: qsTr("应用动画")
    color:"gray"
    property bool running: false
    CliableImageV2
    {
        id:panda1
        focus: true
        x:40;y:root.height-height
        source:"../images/qq.png"
        text:"animation on property"
        //running为true的时候就会开始动画效果,向上移动
        NumberAnimation on y{
            to:40
            duration: 3000
            running:root.running
        }
        onClicked:
        {
            root.running = true
        }
    }
    CliableImageV2
    {
        id:panda2
        focus: true
        x:40+panda1.width+20;y:root.height-height
        source:"../images/qq.png"
        text:"animation on property"
        //y数值变化就会执行NumberAnimation,就变成to:y变化的值
        Behavior on y{
            NumberAnimation{duration: 3000}
        }
        onClicked:
        {
            y = 40
        }
    }

    CliableImageV2
    {
        id:panda3
        focus: true
        x:panda2.width+panda1.width+80;y:root.height-height
        source:"../images/qq.png"
        text:"animation on property"
      	//点击效果出发触发以后就会触发restart,进行反复运动
        onClicked: anim.restart()
        NumberAnimation{
            id:anim
            target: panda3
            //再次点击就又会回来的位置
            from:root.height-panda3.height
            //到终点的位置
            to:40
            duration: 3000
            //目标属性是y
            property:"y"
        }
    }
}

运行效果:
在这里插入图片描述

相关知识点

1、在设计动画开始的时候,running别直接设计成true,因为有时候我们的计算过程需要时间如果还没计算完全就开始运行动画,那么就会出现问题,我们一般都是采用点击进行触发,这样也就可以有给应用程序计算各个变量的时间就像👇

NumberAnimation on y{
            to:40
            duration: 3000
            //在root下创建一个running,使running和root的running进行绑定
            running:root.running
        }
        onClicked:
        {
        	//如果点击了就将root下的running进行修改,从而触发动画
            root.running = true
        }
 }

2、如果想要通过值的改变来触发动画,那么就使用Behavior就可以,解释在代码的注释里面可以去看看,运行玩玩

CliableImageV2
    {
        id:panda2
        focus: true
        x:40+panda1.width+20;y:root.height-height
        source:"../images/qq.png"
        text:"animation on property"
        //y数值变化就会执行NumberAnimation,就变成to:y变化的值
        Behavior on y{
            NumberAnimation{duration: 3000}
        }
        //点击时,y的值进行改变,触发动画
        onClicked:
        {
            y = 40
        }
    }


3、缓动曲线

在 Qt Quick 中,可以使用缓动曲线(Easing Curve)来定义动画的变化速度。缓动曲线可以使动画更加平滑、自然,并增加动画的视觉效果。Qt Quick 提供了几种预定义的缓动曲线,您可以在动画中使用这些曲线,也可以自定义自己的缓动曲线。

以下是一些常用的预定义缓动曲线:

  • Linear
  • InExpo
  • OutExpo
  • InOutExpo
  • InOoutCubic

代码示例

我现在想要实现一个界面:上面部分有10个缓动曲线矩形框可以进行点击选择,而下面有一个方块,通过上方的缓动曲线的选择,下方的方块以相应的方式移动到另外一端。
实现步骤:
1、设计EasingType组件,用来实现缓动曲线矩形框的公共部分
2、在主方法中创建10个EasingType组件实例
3、在主方法中创建下方用来移动的方块
4、将方块的移动方式与上面的缓动曲线矩形框的选择进行关联,用于更新方块的easing.type进行移动

EasingType.qml

import QtQuick 2.0

Item {
    id:root
    width: 100;height: 100
    property alias title: label.text
    property alias source:image.source
    property var easingType;
    signal clicked
    Image{
        id:image
        anchors.fill:parent
        //各个缓动曲线都有自己的图片表示(如果没有图片的话可以直接画一个矩形表示也是可以的)
        source: "../images/curves/"+title+".png"

        Text {
            id: label
            text: qsTr("text")
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.bottom: parent.bottom
            color:'white'
        }
    }

    MouseArea{
        anchors.fill: parent
        onClicked: root.clicked()
    }
}

main.qml

import QtQuick 2.0
import QtQuick.Layouts 1.0
Rectangle{
    id:root
    width: childrenRect.width
    height: childrenRect.height

    color:'gray'
    gradient: Gradient{
        GradientStop{position:0.0;color:root.color}
        GradientStop{position:1.0;color:Qt.lighter(root.color,1.5)}
    }
    //进行布局
    ColumnLayout{
        spacing: 20
        Grid{
            spacing: 10
            columns:5
            EasingType{
                title:'Linear'
                easingType: Easing.Linear
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'InExpo'
                easingType: Easing.InExpo
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'OutExpo'
                easingType: Easing.OutExpo
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'InOutExpo'
                easingType: Easing.InOutExpo
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'InOutCubic'
                easingType: Easing.InOutCubic
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'SineCurve'
                easingType: Easing.SineCurve
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'InOutCirc'
                easingType: Easing.InOutCirc
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'InOutElastic'
                easingType: Easing.InOutElastic
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'InOutBack'
                easingType: Easing.InOutBack
                onClicked: {
                    animation.easing.type=easingType

                    box.toggle=!box.toggle
                }
            }
            EasingType{
                title:'InOutBounce'
                easingType: Easing.InOutBounce
                onClicked: {
                    animation.easing.type=easingType
                    box.toggle=!box.toggle
                }
            }
        }
        Rectangle{
            height:100
            Layout.fillWidth: true
            gradient: Gradient{
                GradientStop{position:0.0;color:'gray'}
                GradientStop{position:1.0;color:'green'}
            }
            Rectangle{
                id:box
                property  bool toggle
                anchors.verticalCenter: parent.verticalCenter
                width: 80;height:80
                //渐变色
                gradient: Gradient{
                    GradientStop{position:0.0;color:'red'}
                    GradientStop{position:1.0;color:'yellow'}
                }

                x:toggle?20:root.width-width-20
                Behavior on x{
                    NumberAnimation{
                        id:animation
                        duration:1000
                    }
                }
            }
        }
    }
}

运行结果:
在这里插入图片描述

相关知识点

对于缓动曲线的设置,其实最终还是作用于动画上,其实只是改变了动画的样式,能够让轨迹更加酷炫或者说是更顺滑就像👇

//当x发生变化时,开始以easing.type的样式进行移动
Behavior on x{
   NumberAnimation{
   	   //在这替换成你想要的缓动曲线类型就可以了
   	   easing.type="xxxxx"
       id:animation
       duration:1000
   }
}

4、动画分组

分组有两种方式:并行或顺序
可以使用SequentialAnimation(顺序)ParallelAnimation(并行)元素,它们充当其他动画元素的动画容器。这些分组动画本身就是动画。

在这里插入图片描述

代码示例

现在要创建一个工程,是将一个飞碟从左下角移动到右上角,通过两种方式对移动进行描述,分别是顺序和并行。

组件ClickableImageV3.qml

import QtQuick 2.0

Item {
    id:root
    width: container.childrenRect.width
    height: container.childrenRect.height
    property alias source: image.source
    property alias text: label.text
    signal clicked

    Column{
        id:container
        Image{
            id:image
        }

        Text {
            id: label
            width: image.width
            horizontalAlignment: Text.AlignHCenter
            wrapMode: Text.WordWrap
            color:'white'
        }
    }


    MouseArea{
        anchors.fill: parent
        onClicked: root.clicked()
    }
}

顺序执行代码main.qml

import QtQuick 2.0
import QtQuick.Window 2.0
Window {
    id:root
    width: 640
    height: 480
    visible: true
    title: qsTr("UFO")
    property int duration: 3000

    Image {
        source: "../images/background.png"
        anchors.fill: parent
    }

    ClickableImageV3{
        id:ufo
        x:20;y:root.height-height
        source: "../images/ufo.png"
        text:'UFO'
        onClicked: anim.restart()
    }
    //顺序的执行
    SequentialAnimation{
        id:anim
        NumberAnimation{
            target:ufo
            properties: "y"
            from:root.height-ufo.height
            to:20
            duration: root.duration
        }

        NumberAnimation{
            target:ufo
            properties: "x"
            from:20
            to:500
            duration: root.duration
        }
    }
}

运行效果:
在这里插入图片描述

并行执行代码main.qml

import QtQuick 2.0
import QtQuick.Window 2.0
Window {
    id:root
    width: 640
    height: 480
    visible: true
    title: qsTr("UFO")
    property int duration: 3000

    Image {
        source: "../images/background.png"
        anchors.fill: parent
    }

    ClickableImageV3{
        id:ufo
        x:20;y:root.height-height
        source: "../images/ufo.png"
        text:'UFO'
        onClicked: anim.restart()
    }
    //并行的执行
    ParallelAnimation/*SequentialAnimation*/{
        id:anim
        NumberAnimation{
            target:ufo
            properties: "y"
            from:root.height-ufo.height
            to:20
            duration: root.duration
        }

        NumberAnimation{
            target:ufo
            properties: "x"
            from:20
            to:500
            duration: root.duration
        }
    }
}

运行结果:
在这里插入图片描述


5、嵌套动画

分组动画也可以嵌套。例如,一个连续动画可以有两个并行动画作为子动画。我们可以通过一个足球示例:

  • 从左到右的x平移(X1)
  • 从下到上的y平移(Y1),然后是从上到下的平移(Y2),带有一些弹跳
  • 在动画的整个持续时间内旋转360度(ROT1)
    在这里插入图片描述

代码示例

实现的功能就和上图差不多,模拟一个足球给踢上去,又掉下地面的效果
main.qml

import QtQuick 2.9
import QtQuick.Window 2.3

Item {
    id:root
    visible: true
    width: 480
    height: 300
    property int duration: 3000
    Rectangle
    {
        id:sky
        width:parent.width
        height: 200
        gradient: Gradient
        {
            GradientStop{position: 0.0;color:"#0080FF"}
            GradientStop{position: 1.0;color:"#66CCFF"}
        }
    }
    Rectangle
    {
        id:ground
        anchors.top:sky.bottom
        anchors.bottom: root.bottom
        width:parent.width
        height: 100
        //渐变色效果
        gradient: Gradient
        {
            GradientStop{position: 0.0;color:"#00FF00"}
            GradientStop{position: 1.0;color:"#00803F"}
        }
    }
    Image{
        id:ball
        source:"../images/soccer_ball.png"
        scale:0.5
        x:0;
        y:root.height-height

        MouseArea{
            anchors.fill:parent
            onClicked:
            {
                //回归原位
                ball.x=0
                ball.y = root.height-ball.height
                ball.rotation = 0
                anim.restart()
            }
        }

        ParallelAnimation
        {
            id:anim
            SequentialAnimation
            {
                NumberAnimation
                {
                    properties: "y"
                    target: ball
                    to:20
                    duration:root.duration*0.4
                    //加上EasingType属性,让变化更生动
                    easing.type:Easing.outCirc
                }
                NumberAnimation
                {
                    properties: "y"
                    target: ball
                    to:root.height-ball.height
                    duration:root.duration*0.6
                    //加上EasingType属性,让变化更生动
                    easing.type:Easing.OutBounce
                }


            }
            //球上去+下去的事件和球到右边的时间要相等
            NumberAnimation
            {
                properties: "x"
                target: ball
                to:380
                duration:root.duration
            }
            RotationAnimation
            {
                properties: "rotation"
                target: ball
                to:720
                duration:root.duration
            }

        }


    }

}

运行结果:
在这里插入图片描述


6、状态转换

  • 状态State定义了一组属性的更改,可以由特定条件触发。
  • 状态State开关可以附加一个转换,该转换定义了这些更改对应的动画,或执行附加的行为。
  • 进入状态State时也可以执行行为。

代码示例

现在要实现一个工程:一个红绿灯,当点击页面的时候,会进行红绿灯的转换(通过State改变进行切换)
main.qml

import QtQuick 2.9
import QtQuick.Window 2.3

Item
{
    id:root
    width:150;
    height:300;
    property color black: "black"
    property color red: "red"
    property color green: "green"

    Rectangle
    {
        anchors.fill:parent
        color:"#333333"

    }
    state:"stop"
    states:
    [
        State {
            name: "stop"
            PropertyChanges {target: light1;color:root.red}
            PropertyChanges {target: light2;color:root.black}
        },
        State {
            name: "go"
            PropertyChanges {target: light1;color:root.black}
            PropertyChanges {target: light2;color:root.green}
        }
    ]

    Rectangle
    {
        id:light1
        x:25;y:15;
        width: 100
        height: 100
        //将radius设置成width/2就是圆形了
        radius: width/2
        color: root.black
        border.color:Qt.lighter(color,1.1)
    }

    Rectangle
    {
        id:light2
        x:25;y:130;
        width: 100
        height: 100
        radius: width/2
        color: root.black
        border.color:Qt.lighter(color,1.1)
    }
    MouseArea{
        anchors.fill:parent
        onClicked: parent.state=(parent.state=="stop"?"go":"stop")
    }

}

运行效果:
在这里插入图片描述

我们还可以加上transitions进行过渡,让变化进行的地更自然:
main.qml

import QtQuick 2.9
import QtQuick.Window 2.3

Item
{
    id:root
    width:150;
    height:300;
    property color black: "black"
    property color red: "red"
    property color green: "green"

    Rectangle
    {
        anchors.fill:parent
        color:"#333333"

    }
    state:"stop"
    states:
    [
        State {
            name: "stop"
            PropertyChanges {target: light1;color:root.red}
            PropertyChanges {target: light2;color:root.black}
        },
        State {
            name: "go"
            PropertyChanges {target: light1;color:root.black}
            PropertyChanges {target: light2;color:root.green}
        }
    ]

    //会让转换更加的柔和
    transitions: [
        Transition {
            from:"*";to:"*"

            ColorAnimation {
                target:light1;properties: "color";duration:1000
            }
            ColorAnimation {
                target:light2;properties: "color";duration:1000
            }

        }
    ]

    Rectangle
    {
        id:light1
        x:25;y:15;
        width: 100
        height: 100
        //将radius设置成width/2就是圆形了
        radius: width/2
        color: root.black
        border.color:Qt.lighter(color,1.1)
    }

    Rectangle
    {
        id:light2
        x:25;y:130;
        width: 100
        height: 100
        radius: width/2
        color: root.black
        border.color:Qt.lighter(color,1.1)
    }
    MouseArea{
        anchors.fill:parent
        onClicked: parent.state=(parent.state=="stop"?"go":"stop")
    }

}

运行效果

在这里插入图片描述

相关知识点

  • 可以在transitions对状态的转变进行过渡设置,让状态的改变能够更加的自然
transitions: [ 
	Transition { 
		from: "stop"; to: "go" 
		//从任何状态到任何状态用*to*
		// from: "*"; to: "*" 
		ColorAnimation { target: light1; properties: "color"; duration: 2000 } 
		ColorAnimation { target: light2; properties: "color"; duration: 2000 } 
	} 
] 
  • 将矩形的height和width设置成一样,并且将radius设置为width/2,那就是圆形
Rectangle
{
     id:light2
     x:25;y:130;
     width: 100
     height: 100
     radius: width/2
     color: root.black
     border.color:Qt.lighter(color,1.1)
 }

结语

通过本篇博客,我们深入探索了Qt Quick中的应用动画、缓动曲线、动画分组、嵌套动画以及状态转换。动画作为现代应用程序中重要的交互元素,能够为用户带来更流畅、生动的界面体验,提升应用程序的吸引力和用户满意度。
希望本篇博客对你理解和应用Qt Quick中的动画功能有所帮助。如果你在学习过程中有任何问题或疑惑,欢迎在评论区提问。祝愿你在使用Qt Quick的动画能力时能够创造出令人赞叹的应用程序!感谢阅读本篇教程,期待与你在下一篇教程再次相见!(*^_^*)(*^_^*)

在这里插入图片描述

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

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

相关文章

安卓进阶(一)App性能优化

文章目录 性能优化的目的及方向流畅性启动速度页面显示速度响应速度 稳定性ANRCrash 资源节省性 布局优化选择耗费性能较少的布局减少布局的层级(嵌套)使用布局标签尽量少用布局属性wrap_contentincludemergeinclude与merge的区别ViewStub 内存泄露常见内…

计算机网络实验:交换机的Telnet远程登录配置

目录 前言实验目的实验内容实验过程画出拓扑图设置IP3,给交换机设IP,实际上相当于给VLAN 1 这个接口设置IP4,连网线5,测试网络是否连通6,通过telnet去管理配置交换机交换机的密码2、console密码3、telnet密码 总结 前言…

【CSS3系列】第五章 · web 字体

写在前面 Hello大家好, 我是【麟-小白】,一位软件工程专业的学生,喜好计算机知识。希望大家能够一起学习进步呀!本人是一名在读大学生,专业水平有限,如发现错误或不足之处,请多多指正&#xff0…

【3DsMAX】从零开始建房(1)

目录 目标 步骤 1. 制作地基 2. 制作台阶 3. 制作地砖 4. 制作第一层主体 5. 挖空第一层门的位置 6. 制作展示厅 目标 要做的房子模型如下: 步骤 1. 制作地基 首先创建一个长方体 可以将其转换为可编辑多边形,然后选中所有顶点,调…

【复变函数笔记】解析函数的定义和性质

文章目录 解析函数的等价定义解析函数的性质 解析函数的等价定义 解析函数的定义: f ( z ) f(z) f(z)在区域内可导则在区域内解析,在一点解析就是在某一邻域内可导。解析函数不可能只在一点解析。柯西-黎曼方程:函数 f ( z ) u ( x , y ) …

【TreeSet集合】比较器排序Comparator的使用

比较器排序Comparator的使用 存储学生对象并遍历,创建TreeSet集合使用带参构造方法 要求:按照年龄从小到大排序,年龄相同时,按照姓名的字母顺序排序 创建学生类: package com.gather.set.treeset; public class Stude…

Nginx网站服务——编译安装与系统服务添加

一、Nginx简介 Nginx特点:(占用内存少,并发能力强) Nginx 是开源、高性能、高可靠的 Web 和反向代理服务器,而且支持热部署,几乎可以做到 7 * 24 小时不间断运行,即使运行几个月也不需要重新启…

makefile编译debug版本调试时无法定位到源文件:No source available for “main() at 0x8544“

问题 之前用makefile编译了一个release版本的可执行文件,但是后面想调试的时候发现无法调试。 觉得-g就能解决问题,后面发现根本不行。 这里虽然加了-g选项,但是调试的时候还是出现找不到源文件的情况。 解决方案 对已有的C/C工程用mak…

Backtrader官方中文文档:第三章Quickstart Guide快速入门

本文档参考backtrader官方文档,是官方文档的完整中文翻译,可作为backtrader中文教程、backtrader中文参考手册、backtrader中文开发手册、backtrader入门资料使用。 快速入门章节目录 快速入门使用平台从0到100:一步一步的演示基本设置设置现…

2023PS beta 爱国版注册安装教程

软件介绍 主要新功能包括: Generative Fill功能(仅在Photoshop Beta桌面应用程序中可用)。这是一个新的工具,可以使用简单的文本提示非破坏性地添加,扩展或删除图像中的内容,以实现令人惊喜,高兴和震惊的真实结果——几秒钟内。要使用此功能,请选择图像中的目标对象或区域,然…

全局流控 or 端到端拥塞控制

同事推荐一篇论文 Bolt: Sub-RTT Congestion Control for Ultra-Low Latency,写点想法。 端到端原则使网络在拥塞控制中始终扮演配角,人们认为拥塞控制是端到端的事。几十年来人们设计的拥塞控制机制始终围绕 “主机在什么情况下要增减 cwnd” 打转。但…

MongoDB 分片集的基本概念

什么是分片集? 副本集(ReplicaSet) 用于解决读请求扩展、高可用等问题。但随着业务场景的进一步增长,可能会出现以下问题: 存储容量超出单机磁盘容量;活跃数据集超出单机内存容量,很多读请求需…

使用Python将《青花瓷》歌词生成词云图

哈喽大家好,因为上次有小伙伴问我,歌曲的歌词和评论怎么生成词云图,想买代码… 当时我就拒绝了,直接免费送给了他。 所以今天来分享给大家 我们以周董的《青花瓷》为例,要对《青花瓷》歌词生成词云图,需…

[Flash][AS3]“懒惰式引用计数回收内存“导致程序崩溃(闪退)

最近在做Flash项目时候发现,Flash CS6 发布的程序在运行超过两个小时后会闪退,在仔细检查脚本代码和资源文件后,排除了这两个方面的原因。又猜测是内存或者GDI泄漏,在任务管理器中观察了一段时间,程序的GDI没有任何变化…

电脑开机总是卡到不能动怎么重装系统?

电脑开机总是卡到不能动怎么重装系统?有用户反馈自己的电脑在开机之后,总是会出现卡死的情况,无法进行任何的操作。遇到这个问题我们可以使用U盘重装系统的方法来进行电脑系统的重装,接下来我们一起来看看以下具体的操作步骤教学吧…

3.7 图像压缩

博主简介:一个爱打游戏的计算机专业学生博主主页: 夏驰和徐策所属专栏:算法设计与分析 1.什么是图像压缩? 在动态规划中,图像压缩是指通过减少图像数据的存储空间,以实现图像文件的压缩和存储优化。动态规…

chatgpt赋能python:从后往前取:Python列表的高效操作

从后往前取:Python列表的高效操作 在Python编程中,列表(List)是最常用的数据类型之一。列表可以保存任意类型的元素,比如数字、字符串、甚至是其他列表等。在这篇文章中,我们将关注Python列表中从后往前取…

【CSS3系列】第四章 · CSS3新增渐变

写在前面 Hello大家好, 我是【麟-小白】,一位软件工程专业的学生,喜好计算机知识。希望大家能够一起学习进步呀!本人是一名在读大学生,专业水平有限,如发现错误或不足之处,请多多指正&#xff0…

chatgpt赋能python:Python列表全排列

Python列表全排列 列表是Python中最常用的数据结构之一,它允许我们将多个值(数据)存储在一个变量中。在Python中,有时我们需要对列表中的元素进行全排列,也就是根据不同的顺序重新排列列表中的元素。本文将介绍如何在…

计算机网络实验:交换机的基本配置与管理

目录 前言实验目的实验内容实验过程总结 前言 本实验旨在了解交换机的基本功能和工作原理,掌握交换机的配置方法和命令,学习交换机端口的基本设置和管理,以及交换机MAC地址表的查看和维护。通过本实验,学生可以熟悉交换机的操作界…