官方例子-kriacluster3ddemo 第一章



  • 今天我们来通过官方例子,学习Qt 3D Studio开发

    0_1525999711931_5a947921-b5b8-4fdf-a918-8a844aefa535-image.png

    启动时候,两个仪表盘会旋转

    0_1526000081717_20180511_085157 (1).gif

    分析过程

    1.演示文稿加载了mainPresentation.uia

    Presentation {
                id: cluster
                source: "qrc:/presentation/mainPresentation.uia"
    }
    

    2.Studio默认启动时候播放2D这个幻灯片,持续1s,没动画,播放结束自动跳到下一个幻灯片

    0_1526001296538_9d9457ef-37e8-4a25-b463-a13dad9a7d27-image.png

    3.TurnGauges这个幻灯片,执行了一个小动画,注意右侧Rotation,播放结束自动跳到下一个幻灯片

    0_1526001906611_20180511_092330.gif

    仪表盘分4部分组成
    0_1526002196787_d10fa0ea-3821-48fe-ae4b-0d3787428a21-image.png

    4.Base这个幻灯片, 一进入就是暂停状态,也没有动画

    0_1526002337918_91db3734-aa95-47ba-b14e-6dd701f73e16-image.png

    5.Presentation对Base阶段进行了判定,触发后续动作

    onSlideEntered: {
        if (name === "Base")
            startupAnimation = false;
    }
    

    特效

    mainPresentation.uip工程里并没有看到红色特效,但是mainPresentation.uia效果里面有特效

    因为mainPresentation只是总演示文稿,它还有很多子演示文稿,其中就有tachoBackground和speedBackground

    0_1526004467793_ddd2ff2d-6f84-4796-957f-04a7e9196754-image.png

    0_1526004827770_166996ef-8dae-4af3-964e-8b26e96d1f99-image.png

    颜色特效分红色,和蓝色,默认红色

    DataInput {
        name: "colorSlide"
        value: redTheme ? "red" : "blue"
    }
    

    注意左侧中间有个colorSlide,代码通过控制colorSlide变量,实现两个幻灯片切换,达到切换特效的效果

    0_1526005579774_20180511_102441.gif

    至此,开机3D动画部分理解完毕

    小练习

    程序里可以设置颜色,但是我切换颜色后,两个表盘颜色没有改变,原来是绑定有问题,原绑定带$,重新绑定后没有了$

    0_1526007857647_2f110c7a-695c-454f-a4c9-5b94f7c42f6e-image.png

    0_1526008088145_20180511_110607.gif



  • 这个demo的话,我似乎在它的演示视频中看过。3D的效果令人眼前一亮。只要字体好看一些,那么的确是个可以拿的出手的作品。


 

最近的回复

  • @bladesero Blender 在角色建模和渲染这些方面的确比较强。😄

    我们的软件还在发展中呢。
    18da2116-2055-47c1-8317-1ccde17dfcc0-image.png

    阅读更多
  • untitled.jpg figure角色(WIP2).jpg
    TIM截图20190117184210.png
    使用的软件是blender,zbrush和substance painter

    阅读更多
  • 背景:如果需要qml显示循环list,一般是用3个ListView循环交替,实现伪循环,期间逻辑复杂,容易出错,PathView本身自带循环,所以考虑用PathView实现循环

    设计:PathView显示5条数据,按照垂直List一个个排好顺序,由于收尾移动时候会空白穿帮,所以用clip控制显示中间三条数据

    滚动控制:currentIndex,decrementCurrentIndex(),incrementCurrentIndex()

    代码:

    Item{ id: item1 property int myIndex: 0 property int onePageCount: 3 property real oneHeight: 72 property real oneWidth: 580 property int isCurrentListView: 1 //0,1,2 property bool isAdd: true //direction,down=true,up=false property int hightlightIndex: 0 property int currentIndexPathView: 0 //use this Item{ id: itemClip width: item1.oneWidth height: item1.oneHeight*3 clip: true PathView { id: listView1 width: item1.oneWidth model: listModelSpeedWarning delegate: delegeteLine pathItemCount: item1.onePageCount+2 interactive: false path: Path { startX: item1.oneWidth/2 startY: -item1.oneHeight/2 PathQuad { x: item1.oneWidth/2; y: item1.oneHeight*0+item1.oneHeight/2; controlX: item1.oneWidth/2; controlY: item1.oneHeight*0+item1.oneHeight/2 } PathQuad { x: item1.oneWidth/2; y: item1.oneHeight*1+item1.oneHeight/2; controlX: item1.oneWidth/2; controlY: item1.oneHeight*1+item1.oneHeight/2 } PathQuad { x: item1.oneWidth/2; y: item1.oneHeight*2+item1.oneHeight/2; controlX: item1.oneWidth/2; controlY: item1.oneHeight*2+item1.oneHeight/2 } PathQuad { x: item1.oneWidth/2; y: item1.oneHeight*3+item1.oneHeight/2; controlX: item1.oneWidth/2; controlY: item1.oneHeight*3+item1.oneHeight/2 } PathQuad { x: item1.oneWidth/2; y: item1.oneHeight*4+item1.oneHeight/2; controlX: item1.oneWidth/2; controlY: item1.oneHeight*4+item1.oneHeight/2 } } Component.onCompleted: { listView1.currentIndex = -1 } } } }

    问题:windows下测试,按住按键不松手,list滚动会卡住,松手后恢复正常,看来list不能滚动太快

    阅读更多
  • H

    @青山白云 只是为了替换GIF,不过目前已经解决加载问题

    阅读更多

关注我们

微博
QQ群











召唤伊斯特瓦尔