Linux-SmartHome-QML-7-主窗口功能搭建

今天继续来写主窗口

第一，先给主窗口来点颜色 color:"#777777"

第二，因为我们的程序全屏显示了，所以了，这里得给它加一个关闭按钮

Rectangle
    {
        id:m_btn_quit
        anchors.top:parent.top
        anchors.right:parent.right
        color:"#FF0000"
        width:100
        height:30
        MouseArea
        {
            anchors.fill:parent
            onClicked:
            {
                Qt.quit();
            }
        }
        Text
        {
            anchors.centerIn:parent
            color:"#FFFFFF"
            text:"退出系统"
        }
    }

暂时先这么写的，等后面美化的时候，在修改

第三 给我们的程序加一个显示日期和时间的

Text
    {
        id:m_date
        anchors.verticalCenter:m_btn_quit.verticalCenter
        anchors.right:m_btn_quit.left
        anchors.rightMargin: 10
        color:"#FF0000"
        text:"ssddsasdsadsad"
        Timer
        {
            interval:500
            running:true
            repeat:true
            onTriggered:
            {
                m_date.text = Qt.formatDateTime(new Date(),"yyyy年MM月dd日 hh:mm:ss dddd")
            }
        }
    }

最后，在给我们加一个标题，

Text
    {
        id:m_title
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.verticalCenter: m_btn_quit.berticalCenter
        color:"#FFFFFF"
        text:"My Family"
    }

整个程序的运行效果了

 

整个主窗口的全部代码

/*
  Author:Jianwei.zhang
  Date:2018.09.12
  Brief:MainWindow
 */

import QtQuick 2.9
import QtQuick.Window 2.2

Window
{
    visible: true
    visibility:Window.FullScreen    //Show FullScreen
    color:"#777777"

    Rectangle
    {
        id:m_btn_quit
        anchors.top:parent.top
        anchors.right:parent.right
        color:"#FF0000"
        width:100
        height:30
        MouseArea
        {
            anchors.fill:parent
            onClicked:
            {
                Qt.quit();
            }
        }
        Text
        {
            anchors.centerIn:parent
            color:"#FFFFFF"
            text:"退出系统"
        }
    }

    /*
      Show Date and Time
     */
    Text
    {
        id:m_date
        anchors.verticalCenter:m_btn_quit.verticalCenter
        anchors.right:m_btn_quit.left
        anchors.rightMargin: 10
        color:"#FF0000"
        text:"ssddsasdsadsad"
        Timer
        {
            interval:500
            running:true
            repeat:true
            onTriggered:
            {
                m_date.text = Qt.formatDateTime(new Date(),"yyyy年MM月dd日 hh:mm:ss dddd")
            }
        }
    }

    /*
      Show My Family Name
     */
    Text
    {
        id:m_title
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.verticalCenter: m_btn_quit.berticalCenter
        color:"#FFFFFF"
        text:"My Family"
    }


}

这个项目大家可以在我的Git上面找到

https://github.com/DreamLifeOffice/SmartHome