diff --git a/main/main.py b/main/main.py
index 5d44112..5553c76 100644
--- a/main/main.py
+++ b/main/main.py
@@ -1,10 +1,78 @@
+import os
+import sys
+
+from PyQt5.QtGui import *
 from PyQt5.QtWidgets import *
-from PyQt5.QtCore import *
-import os, sys
+from PyQt5.QtCore import Qt
+
+from utils.QSSLoader import QSSLoader
+from view.UserLabel import User
+from view.SelfListWidgetItem import SelfListWidgetItem
 
 
-class MainWindow():
+class MainWidget(QWidget):
+    def __init__(self):
+        super(MainWidget, self).__init__()
+        self.user_label = User()
+        # 主布局，左右两侧
+        layout = QHBoxLayout()
+        # 子布局,左边的部分
+        self.sub_layout = QVBoxLayout()
+        self.sub_layout.spacing()
+        self.sub_layout.addWidget(self.user_label, 1)
+        # 左侧列表
+        self.system_listWidget = QListWidget(self)
+        self.sub_layout.addWidget(self.system_listWidget, 2)
+
+        # 可自定义添加的listWidget
+        self.self_listWidget = QListWidget(self)
+        self.sub_layout.addWidget(self.self_listWidget, 7)
+        # 右侧层叠窗口
+        self.stackedWidget = QStackedWidget(self)
+
+        layout.addLayout(self.sub_layout, Qt.AlignJustify)
+
+        layout.addWidget(self.stackedWidget, 2)
+
+        self.one_day = SelfListWidgetItem('我的一天', 1, os.getcwd() + '/../images/sun.svg')
+        self.self_listWidget.setCurrentRow(1)
+        # self.one_day.setSelected(True)
+        self.important = SelfListWidgetItem('重要', 0, os.getcwd() + '/../images/star.svg')
+
+        self.setLayout(layout)
+        self.initUI()
+
+    def initUI(self):
+        self.system_listWidget.addItem(self.one_day)
+        self.system_listWidget.setItemWidget(self.one_day, self.one_day.widget)
+
+        self.system_listWidget.addItem(self.important)
+
+        self.system_listWidget.setItemWidget(self.important, self.important.widget)
+
+        pass
+
+
+class MainWindow(QWidget):
     def __init__(self):
         super(MainWindow, self).__init__()
-        layout = QHBoxLayout()
-        left_layout=QHBoxLayout()
+        self.resize(1050, 800)
+        self.setWindowTitle("待办事项")
+        # 主布局，用来显示主页面，设置页面等
+        self.layout = QStackedLayout(self)
+
+        self.main_widget = MainWidget()
+        # self.main_widget.resize(50, 200)
+        self.layout.addWidget(self.main_widget)
+
+
+if __name__ == "__main__":
+    app = QApplication(sys.argv)
+    main = MainWindow()
+    # print(os.path.abspath('../'))
+    style_sheet = QSSLoader.read_qss_file('../resource/current.qss')
+    main.setStyleSheet(style_sheet)
+
+    app.setWindowIcon(QIcon(os.path.abspath('../') + '/images/todo.svg'))
+    main.show()
+    sys.exit(app.exec_())
diff --git a/resource/current.qss b/resource/current.qss
index 40add43..b24d882 100644
--- a/resource/current.qss
+++ b/resource/current.qss
@@ -4,61 +4,78 @@ QListWidget, QListView, QTreeWidget, QTreeView {
 }
 /*设置左侧选项的最小最大宽度,文字颜色和背景颜色*/
 QListWidget {
-    min-width: 120px;
-    max-width: 120px;
+    min-width: 250px;
+    max-width: 250px;
     color: white;
-    background: black;
-
+    background: #f3f3f3;
+    border:none;
 }
 
-QPushButton {
-    max-width: 120px;
-    color: white;
-    border-top-left-radius:10px;  
-    border-top-right-radius:10px;
-    border-bottom-left-radius:10px;
-    border-bottom-right-radius:10px;
-    background: pink;
-}
-QPushButton:pressed,
-QPushButton:pressed:focus {
-    /* 改变背景色 */  
-  background-color: #f50057;
-  /* 改变边框风格 */  
-    border-style:inset; 
-    /* 改变边框风格 */  
-    border-style:inset;  
-}
-
-QPushButton#upload_btn {
-    padding: 3px 20px;
-    text-align:center;
-}
-
-
 /*被选中时的背景颜色和左边框颜色*/
 QListWidget::item:selected {
-    background: rgb(52, 52, 52);
+    background: #eaeaea;
     border-right: 4px solid rgb(9, 187, 7);
 }
-/*鼠标悬停颜色*/
-HistoryPanel::item:hover {
-    background: rgb(52, 52, 52);
+
+
+/*设置QListWidgetItem样式*/
+QListWidget::item {
+    color: red;
+    font-family:#f3f3f3 ;
+/*    border-right: 4px solid rgb(9, 187, 7);*/
 }
 
+/*QPushButton {*/
+/*    max-width: 120px;*/
+/*    color: white;*/
+/*    border-top-left-radius:10px;  */
+/*    border-top-right-radius:10px;*/
+/*    border-bottom-left-radius:10px;*/
+/*    border-bottom-right-radius:10px;*/
+/*    background: pink;*/
+/*}*/
+/*QPushButton:pressed,*/
+/*QPushButton:pressed:focus {*/
+/*    *//* 改变背景色 *//*  */
+/*  background-color: #f50057;*/
+/*  *//* 改变边框风格 *//*  */
+/*    border-style:inset; */
+/*    *//* 改变边框风格 *//*  */
+/*    border-style:inset;  */
+/*}*/
+
+/*QPushButton#upload_btn {*/
+/*    padding: 3px 20px;*/
+/*    text-align:center;*/
+/*}*/
+
+
+
+/*鼠标悬停颜色*/
+/*HistoryPanel::item:hover {*/
+/*    background: rgb(52, 52, 52);*/
+/*}*/
+
 /*右侧的层叠窗口的背景颜色*/
 QStackedWidget {
-    background: rgb(30, 30, 30);
+    color:snow;
+    background: black;
 }
-/*模拟的页面*/
-QLabel {
-    color: white;
+/*todo_count_label 气泡效果*/
+QLabel#todo_count_label {
+/*    color: black;*/
+    border-radius: 8px;
+    text-align:center;
+    background-color:#dcdcdc;
+/*    max-width:16px; max-height: 16px;*/
+    border:1px solid black;
+    font-size:10px;
 }
-QLineEdit {
-    border: 2px solid rgb(52,52,52);
-    border-top-left-radius:10px;  
-    border-top-right-radius:10px;
-    border-bottom-left-radius:10px;
-    border-bottom-right-radius:10px;
+/*QLineEdit {*/
+/*    border: 2px solid rgb(52,52,52);*/
+/*    border-top-left-radius:10px;  */
+/*    border-top-right-radius:10px;*/
+/*    border-bottom-left-radius:10px;*/
+/*    border-bottom-right-radius:10px;*/
 
-}
\ No newline at end of file
+/*}*/
\ No newline at end of file
diff --git a/test/CircleImage.py b/test/CircleImage.py
new file mode 100644
index 0000000..72a10fb
--- /dev/null
+++ b/test/CircleImage.py
@@ -0,0 +1,77 @@
+#!/usr/bin/env python
+# -*- coding: utf-8 -*-
+
+"""
+Created on 2018年1月20日
+@author: Irony
+@site: https://pyqt.site , https://github.com/PyQt5
+@email: 892768447@qq.com
+@file: CircleImage
+@description: 圆形图片
+"""
+import os
+
+try:
+    from PyQt5.QtCore import Qt
+    from PyQt5.QtGui import QPixmap, QPainter, QPainterPath
+    from PyQt5.QtWidgets import QLabel, QWidget, QHBoxLayout, QApplication
+except ImportError:
+    from PySide2.QtCore import Qt
+    from PySide2.QtGui import QPixmap, QPainter, QPainterPath
+    from PySide2.QtWidgets import QLabel, QWidget, QHBoxLayout, QApplication
+
+
+class Label(QLabel):
+
+    def __init__(self, *args, antialiasing=True, **kwargs):
+        super(Label, self).__init__(*args, **kwargs)
+        self.Antialiasing = antialiasing
+        self.setMaximumSize(200, 200)
+        self.setMinimumSize(200, 200)
+        self.radius = 100
+
+        #####################核心实现#########################
+        self.target = QPixmap(self.size())  # 大小和控件一样
+        self.target.fill(Qt.transparent)  # 填充背景为透明
+
+        p = QPixmap(os.path.abspath('../') + '/images/user.svg').scaled(  # 加载图片并缩放和控件一样大
+            200, 200, Qt.KeepAspectRatioByExpanding, Qt.SmoothTransformation)
+
+        painter = QPainter(self.target)
+        if self.Antialiasing:
+            # 抗锯齿
+            painter.setRenderHint(QPainter.Antialiasing, True)
+            painter.setRenderHint(QPainter.HighQualityAntialiasing, True)
+            painter.setRenderHint(QPainter.SmoothPixmapTransform, True)
+
+        #         painter.setPen(# 测试圆圈
+        #             QPen(Qt.red, 5, Qt.SolidLine, Qt.RoundCap, Qt.RoundJoin))
+        path = QPainterPath()
+        path.addRoundedRect(
+            0, 0, self.width(), self.height(), self.radius, self.radius)
+        # **** 切割为圆形 ****#
+        painter.setClipPath(path)
+        #         painter.drawPath(path)  # 测试圆圈
+
+        painter.drawPixmap(0, 0, p)
+        self.setPixmap(self.target)
+        #####################核心实现#########################
+
+
+class Window(QWidget):
+
+    def __init__(self, *args, **kwargs):
+        super(Window, self).__init__(*args, **kwargs)
+        layout = QHBoxLayout(self)
+        layout.addWidget(Label(self))
+        layout.addWidget(Label(self, antialiasing=False))
+        self.setStyleSheet("background: white;")
+
+
+if __name__ == "__main__":
+    import sys
+
+    app = QApplication(sys.argv)
+    w = Window()
+    w.show()
+    sys.exit(app.exec_())
diff --git a/test/FadeInOut.py b/test/FadeInOut.py
new file mode 100644
index 0000000..eee30dc
--- /dev/null
+++ b/test/FadeInOut.py
@@ -0,0 +1,60 @@
+#!/usr/bin/env python
+# -*- coding: utf-8 -*-
+
+
+"""
+Created on 2018年6月14日
+@author: Irony
+@site: https://pyqt.site , https://github.com/PyQt5
+@email: 892768447@qq.com
+@file: FadeInOut
+@description:
+"""
+
+from PyQt5.QtCore import QPropertyAnimation
+from PyQt5.QtWidgets import QApplication, QWidget, QVBoxLayout, QPushButton
+
+
+class Window(QWidget):
+
+    def __init__(self, *args, **kwargs):
+        super(Window, self).__init__(*args, **kwargs)
+        self.resize(400, 400)
+        layout = QVBoxLayout(self)
+        layout.addWidget(QPushButton('退出', self, clicked=self.doClose))
+
+        # 窗口透明度动画类
+        self.animation = QPropertyAnimation(self, b'windowOpacity')
+        self.animation.setDuration(1000)  # 持续时间1秒
+
+        # 执行淡入
+        self.doShow()
+
+    def doShow(self):
+        try:
+            # 尝试先取消动画完成后关闭窗口的信号
+            self.animation.finished.disconnect(self.close)
+        except:
+            pass
+        self.animation.stop()
+        # 透明度范围从0逐渐增加到1
+        self.animation.setStartValue(0)
+        self.animation.setEndValue(1)
+        self.animation.start()
+
+    def doClose(self):
+        self.animation.stop()
+        self.animation.finished.connect(self.close)  # 动画完成则关闭窗口
+        # 透明度范围从1逐渐减少到0
+        self.animation.setStartValue(1)
+        self.animation.setEndValue(0)
+        self.animation.start()
+
+
+if __name__ == '__main__':
+    import sys
+
+    app = QApplication(sys.argv)
+    w = Window()
+    w.show()
+    sys.exit(app.exec_())
diff --git a/test/LeftTabStacked.py b/test/LeftTabStacked.py
new file mode 100644
index 0000000..6c8257d
--- /dev/null
+++ b/test/LeftTabStacked.py
@@ -0,0 +1,113 @@
+#!/usr/bin/env python
+# -*- coding: utf-8 -*-
+
+"""
+Created on 2018年5月29日
+@author: Irony
+@site: https://pyqt.site , https://github.com/PyQt5
+@email: 892768447@qq.com
+@file: LeftTabWidget
+@description:
+"""
+
+from random import randint
+
+try:
+    from PyQt5.QtCore import Qt, QSize
+    from PyQt5.QtGui import QIcon
+    from PyQt5.QtWidgets import QApplication, QWidget, QListWidget, QStackedWidget, QHBoxLayout, \
+        QListWidgetItem, QLabel
+except ImportError:
+    from PySide2.QtCore import Qt, QSize
+    from PySide2.QtGui import QIcon
+    from PySide2.QtWidgets import QApplication, QWidget, QListWidget, QStackedWidget, QHBoxLayout, \
+        QListWidgetItem, QLabel
+
+
+class LeftTabWidget(QWidget):
+
+    def __init__(self, *args, **kwargs):
+        super(LeftTabWidget, self).__init__(*args, **kwargs)
+        self.resize(800, 600)
+        # 左右布局(左边一个QListWidget + 右边QStackedWidget)
+        layout = QHBoxLayout(self, spacing=0)
+        layout.setContentsMargins(0, 0, 0, 0)
+        # 左侧列表
+        self.listWidget = QListWidget(self)
+        layout.addWidget(self.listWidget)
+        # 右侧层叠窗口
+        self.stackedWidget = QStackedWidget(self)
+        layout.addWidget(self.stackedWidget)
+        self.initUi()
+
+    def initUi(self):
+        # 初始化界面
+        # 通过QListWidget的当前item变化来切换QStackedWidget中的序号
+        self.listWidget.currentRowChanged.connect(
+            self.stackedWidget.setCurrentIndex)
+        # 去掉边框
+        self.listWidget.setFrameShape(QListWidget.NoFrame)
+        # 隐藏滚动条
+        self.listWidget.setVerticalScrollBarPolicy(Qt.ScrollBarAlwaysOff)
+        self.listWidget.setHorizontalScrollBarPolicy(Qt.ScrollBarAlwaysOff)
+        # 这里就用一般的文本配合图标模式了(也可以直接用Icon模式,setViewMode)
+        for i in range(20):
+            item = QListWidgetItem(
+                QIcon('Data/0%d.ico' % randint(1, 8)), str('选 项 %s' % i), self.listWidget)
+            # 设置item的默认宽高(这里只有高度比较有用)
+            item.setSizeHint(QSize(16777215, 60))
+            # 文字居中
+            item.setTextAlignment(Qt.AlignCenter)
+
+        # 再模拟20个右侧的页面(就不和上面一起循环放了)
+        for i in range(20):
+            label = QLabel('我是页面 %d' % i, self)
+            label.setAlignment(Qt.AlignCenter)
+            # 设置label的背景颜色(这里随机)
+            # 这里加了一个margin边距(方便区分QStackedWidget和QLabel的颜色)
+            label.setStyleSheet('background: rgb(%d, %d, %d);margin: 50px;' % (
+                randint(0, 255), randint(0, 255), randint(0, 255)))
+            self.stackedWidget.addWidget(label)
+
+
+# 美化样式表
+Stylesheet = """
+/*去掉item虚线边框*/
+QListWidget, QListView, QTreeWidget, QTreeView {
+    outline: 0px;
+}
+/*设置左侧选项的最小最大宽度,文字颜色和背景颜色*/
+QListWidget {
+    min-width: 120px;
+    max-width: 120px;
+    color: white;
+    background: black;
+}
+/*被选中时的背景颜色和左边框颜色*/
+QListWidget::item:selected {
+    background: rgb(52, 52, 52);
+    border-left: 2px solid rgb(9, 187, 7);
+}
+/*鼠标悬停颜色*/
+HistoryPanel::item:hover {
+    background: rgb(52, 52, 52);
+}
+
+/*右侧的层叠窗口的背景颜色*/
+QStackedWidget {
+    background: rgb(30, 30, 30);
+}
+/*模拟的页面*/
+QLabel {
+    color: white;
+}
+"""
+
+if __name__ == '__main__':
+    import sys
+
+    app = QApplication(sys.argv)
+    app.setStyleSheet(Stylesheet)
+    w = LeftTabWidget()
+    w.show()
+    sys.exit(app.exec_())
diff --git a/test/QQMenu.py b/test/QQMenu.py
new file mode 100644
index 0000000..72b8165
--- /dev/null
+++ b/test/QQMenu.py
@@ -0,0 +1,129 @@
+#!/usr/bin/env python
+# -*- coding: utf-8 -*-
+
+"""
+Created on 2021/4/7
+@author: Irony
+@site: https://pyqt.site , https://github.com/PyQt5
+@email: 892768447@qq.com
+@file: QQMenu
+@description: 
+"""
+import string
+from random import choice, randint
+
+from PyQt5.QtCore import Qt
+from PyQt5.QtGui import QPixmap, QPainter, QFont, QIcon
+from PyQt5.QtWidgets import QLabel, QMenu, QApplication
+
+Style = """
+QMenu {
+    /* 半透明效果 */
+    background-color: rgba(255, 255, 255, 230);
+    border: none;
+    border-radius: 4px;
+}
+
+QMenu::item {
+    border-radius: 4px;
+    /* 这个距离很麻烦需要根据菜单的长度和图标等因素微调 */
+    padding: 8px 48px 8px 36px; /* 36px是文字距离左侧距离*/
+    background-color: transparent;
+}
+
+/* 鼠标悬停和按下效果 */
+QMenu::item:selected {
+    border-radius: 0px;
+    /* 半透明效果 */
+    background-color: rgba(232, 232, 232, 232);
+}
+
+/* 禁用效果 */
+QMenu::item:disabled {
+    background-color: transparent;
+}
+
+/* 图标距离左侧距离 */
+QMenu::icon {
+    left: 15px;
+}
+
+/* 分割线效果 */
+QMenu::separator {
+    height: 1px;
+    background-color: rgb(232, 236, 243);
+}
+"""
+
+
+def get_icon():
+    # 测试模拟图标
+    pixmap = QPixmap(16, 16)
+    pixmap.fill(Qt.transparent)
+    painter = QPainter()
+    painter.begin(pixmap)
+    painter.setFont(QFont('Webdings', 11))
+    painter.setPen(Qt.GlobalColor(randint(4, 18)))
+    painter.drawText(0, 0, 16, 16, Qt.AlignCenter,
+                     choice(string.ascii_letters))
+    painter.end()
+    return QIcon(pixmap)
+
+
+def about_qt():
+    # 关于Qt
+    QApplication.instance().aboutQt()
+
+
+class Window(QLabel):
+
+    def __init__(self, *args, **kwargs):
+        super(Window, self).__init__(*args, **kwargs)
+        self.resize(400, 400)
+        self.setAlignment(Qt.AlignCenter)
+        self.setText('右键弹出菜单')
+        self.context_menu = QMenu(self)
+        self.init_menu()
+
+    def contextMenuEvent(self, event):
+        self.context_menu.exec_(event.globalPos())
+
+    def init_menu(self):
+        # 背景透明
+        self.context_menu.setAttribute(Qt.WA_TranslucentBackground)
+        # 无边框、去掉自带阴影
+        self.context_menu.setWindowFlags(
+            self.context_menu.windowFlags() | Qt.FramelessWindowHint | Qt.NoDropShadowWindowHint)
+
+        # 模拟菜单项
+        for i in range(10):
+            if i % 2 == 0:
+                action = self.context_menu.addAction('菜单 %d' % i, about_qt)
+                action.setEnabled(i % 4)
+            elif i % 3 == 0:
+                self.context_menu.addAction(get_icon(), '菜单 %d' % i, about_qt)
+            if i % 4 == 0:
+                self.context_menu.addSeparator()
+            if i % 5 == 0:
+                # 二级菜单
+                # 二级菜单
+                menu = QMenu('二级菜单 %d' % i, self.context_menu)
+                # 背景透明
+                menu.setAttribute(Qt.WA_TranslucentBackground)
+                # 无边框、去掉自带阴影
+                menu.setWindowFlags(menu.windowFlags() | Qt.FramelessWindowHint | Qt.NoDropShadowWindowHint)
+                for j in range(3):
+                    menu.addAction(get_icon(), '子菜单 %d' % j)
+                self.context_menu.addMenu(menu)
+
+
+if __name__ == '__main__':
+    import sys
+    import cgitb
+
+    cgitb.enable(format='text')
+    app = QApplication(sys.argv)
+    app.setStyleSheet(Style)
+    w = Window()
+    w.show()
+    sys.exit(app.exec_())
diff --git a/test/QStackedLayoutDemo.py b/test/QStackedLayoutDemo.py
new file mode 100644
index 0000000..7279d57
--- /dev/null
+++ b/test/QStackedLayoutDemo.py
@@ -0,0 +1,65 @@
+from PyQt5.QtWidgets import QApplication, QWidget, QTextEdit, QVBoxLayout, QPushButton, QStackedLayout
+import sys
+
+
+class FormA(QWidget):
+    def __init__(self, parent=None):
+        super().__init__()
+        self.btnPress = QPushButton("Table AAAA")
+        layout = QVBoxLayout()
+        self.setLayout(layout)
+        layout.addWidget(self.btnPress)
+        self.setStyleSheet("background-color:green;")
+
+
+class FormB(QWidget):
+    def __init__(self, parent=None):
+        super().__init__()
+        self.btnPress = QPushButton("Table BBBB")
+        layout = QVBoxLayout()
+        self.setLayout(layout)
+        layout.addWidget(self.btnPress)
+        self.setStyleSheet("background-color:red;")
+
+
+class TextEditDemo(QWidget):
+    def __init__(self, parent=None):
+        super(TextEditDemo, self).__init__(parent)
+        self.setWindowTitle("QStackedLayout 例子")
+        self.resize(300, 270)
+        # 创建堆叠布局
+
+        self.btnPress1 = QPushButton("FormA")
+        self.btnPress2 = QPushButton("FormB")
+
+        self.form1 = FormA()
+        self.form2 = FormB()
+
+        widget = QWidget()
+        self.stacked_layout = QStackedLayout()
+        widget.setLayout(self.stacked_layout)
+        widget.setStyleSheet("background-color:grey;")
+        self.stacked_layout.addWidget(self.form1)
+        self.stacked_layout.addWidget(self.form2)
+
+        layout = QVBoxLayout()
+        layout.addWidget(widget)
+        layout.addWidget(self.btnPress1)
+        layout.addWidget(self.btnPress2)
+
+        self.setLayout(layout)
+        self.btnPress1.clicked.connect(self.btnPress1_Clicked)
+        self.btnPress2.clicked.connect(self.btnPress2_Clicked)
+
+    def btnPress1_Clicked(self):
+        self.stacked_layout.setCurrentIndex(0)
+
+    def btnPress2_Clicked(self):
+        self.stacked_layout.setCurrentIndex(1)
+
+
+if __name__ == "__main__":
+    app = QApplication(sys.argv)
+    win = TextEditDemo()
+    win.show()
+    sys.exit(app.exec_())
diff --git a/tools/__init__.py b/test/__init__.py
similarity index 100%
rename from tools/__init__.py
rename to test/__init__.py
diff --git a/test/qstackedlauout.py b/test/qstackedlauout.py
new file mode 100644
index 0000000..56b639b
--- /dev/null
+++ b/test/qstackedlauout.py
@@ -0,0 +1,88 @@
+import sys
+from PyQt5 import QtCore, QtGui, QtWidgets
+from PyQt5.QtCore import Qt
+from PyQt5.QtGui import QIcon
+from PyQt5.QtWidgets import (QApplication, QMainWindow, QStackedLayout, QWidget,
+                             QToolBar, QToolButton, QStyle, QColorDialog, QFontDialog,
+                             QVBoxLayout, QGroupBox, QRadioButton)
+
+
+class DemoStackedLayout(QMainWindow):
+    def __init__(self, parent=None):
+        super(DemoStackedLayout, self).__init__(parent)
+
+        # 设置窗口标题
+        self.setWindowTitle('实战PyQt5: QStackedLayout Demo!')
+        # 设置窗口大小
+        self.resize(480, 360)
+
+        self.initUi()
+
+    def initUi(self):
+        toolBar = QToolBar(self)
+        self.addToolBar(Qt.LeftToolBarArea, toolBar)
+
+        btnColor = self.createButton('颜色对话框')
+        btnColor.clicked.connect(lambda: self.onButtonClicked(0))
+        toolBar.addWidget(btnColor)
+        btnFont = self.createButton('字体对话框')
+        btnFont.clicked.connect(lambda: self.onButtonClicked(1))
+        toolBar.addWidget(btnFont)
+        btnUser = self.createButton('分组部件')
+        btnUser.clicked.connect(lambda: self.onButtonClicked(2))
+        toolBar.addWidget(btnUser)
+
+        mainWidget = QWidget(self)
+
+        self.mainLayout = QStackedLayout(mainWidget)
+
+        # 添加三个widget,演示三个页面之间的切换
+
+        # 颜色对话框
+        self.mainLayout.addWidget(QColorDialog(self))
+        # 字体对话框
+        self.mainLayout.addWidget(QFontDialog(self))
+        # 自定义控件
+        self.mainLayout.addWidget(self.createExclusiveGroup())
+
+        mainWidget.setLayout(self.mainLayout)
+        # 设置中心窗口
+        self.setCentralWidget(mainWidget)
+
+    def createButton(self, text):
+        icon = QApplication.style().standardIcon(QStyle.SP_DesktopIcon)
+        btn = QToolButton(self)
+        btn.setText(text)
+        btn.setIcon(icon)
+        btn.setToolButtonStyle(Qt.ToolButtonTextUnderIcon)
+
+        return btn
+
+    def onButtonClicked(self, index):
+        if index < self.mainLayout.count():
+            self.mainLayout.setCurrentIndex(index)
+
+    def createExclusiveGroup(self):
+        groupBox = QGroupBox('Exclusive Radio Buttons', self)
+
+        radio1 = QRadioButton('&Radio Button 1', self)
+        radio1.setChecked(True)
+        radio2 = QRadioButton('R&adio button 2', self)
+        radio3 = QRadioButton('Ra&dio button 3', self)
+
+        vLayout = QVBoxLayout(groupBox)
+        vLayout.addWidget(radio1)
+        vLayout.addWidget(radio2)
+        vLayout.addWidget(radio3)
+        vLayout.addStretch(1)
+
+        groupBox.setLayout(vLayout)
+
+        return groupBox
+
+
+if __name__ == '__main__':
+    app = QApplication(sys.argv)
+    window = DemoStackedLayout()
+    window.show()
+    sys.exit(app.exec())
\ No newline at end of file
diff --git a/tools/QSSLoader.py b/utils/QSSLoader.py
similarity index 100%
rename from tools/QSSLoader.py
rename to utils/QSSLoader.py
diff --git a/tools/nextcloud.py b/utils/__init__.py
similarity index 100%
rename from tools/nextcloud.py
rename to utils/__init__.py
diff --git a/utils/nextcloud.py b/utils/nextcloud.py
new file mode 100644
index 0000000..e69de29
diff --git a/view/SelfListWidgetItem.py b/view/SelfListWidgetItem.py
new file mode 100644
index 0000000..3da9905
--- /dev/null
+++ b/view/SelfListWidgetItem.py
@@ -0,0 +1,54 @@
+from PyQt5.QtWidgets import *
+from PyQt5.QtGui import *
+from PyQt5.QtCore import Qt
+import sys
+import os
+
+
+class SelfListWidgetItem(QListWidgetItem):
+    """
+    :param item_name: 列表名称
+    :param todo_count: 设置剩余代办数量，默认为零
+    :param show_icon: 设置显示的图标路径，默认为空
+    """
+
+    def __init__(self, item_name, todo_count=0, show_icon=None):
+        super(SelfListWidgetItem, self).__init__()
+        layout = QHBoxLayout()
+        # print(show_icon)
+        self.item_name = item_name
+
+        self.todo_count = todo_count
+        self.show_icon = show_icon
+        # 布局
+        self.widget = QWidget()
+        self.widget.setLayout(layout)
+
+        # self.list_item = QLabel('')
+
+        # 添加左边的图标和右边的气泡
+        if self.show_icon:
+            self.icon_label = QLabel('')
+            self.icon_label.setPixmap(
+                QPixmap(self.show_icon).scaled(30, 30, Qt.IgnoreAspectRatio, Qt.SmoothTransformation))
+            layout.addWidget(self.icon_label, 1)
+        # 添加
+        self.item_name_label = QLabel(self.item_name)
+        # print(self.item_name)
+        self.item_name_label.setObjectName('item_name_label')
+        # todo
+        # 需要设置qss使字体靠中间一点
+        # 如果有气泡使气泡靠右
+
+        layout.addWidget(self.item_name_label, 3)
+
+        if self.todo_count:
+            print(self.todo_count)
+            self.todo_count_label = QLabel(str(self.todo_count))
+            self.todo_count_label.setFixedSize(16,16)
+            self.todo_count_label.setScaledContents(True)
+            self.todo_count_label.setObjectName('todo_count_label')
+            self.todo_count_label.setAlignment(Qt.AlignCenter)
+            layout.addWidget(self.todo_count_label, 1)
+        # 设置自定义的QListWidgetItem的sizeHint，不然无法显示
+        self.setSizeHint(self.widget.sizeHint())
diff --git a/view/UserLabel.py b/view/UserLabel.py
new file mode 100644
index 0000000..eb65302
--- /dev/null
+++ b/view/UserLabel.py
@@ -0,0 +1,50 @@
+import os
+import sys
+
+from PyQt5.QtWidgets import *
+from PyQt5.QtGui import *
+from utils.QSSLoader import QSSLoader
+from PyQt5.QtCore import Qt
+
+
+class User(QLabel):
+    def __init__(self):
+        super(User, self).__init__()
+        self.widget = QWidget(self)
+        self.resize(200, 60)
+        # todo
+        # 修改布局使适合微软todo的样式
+        # 设置点击事件，使用右键菜单的样式添加设置、同步、退出
+        # 暂时就这样
+        layout = QHBoxLayout()
+        info_layout = QVBoxLayout()
+        self.pic_label = QLabel('')
+        self.pic_label.setPixmap(
+            QPixmap(os.path.abspath('../') + '/images/user.svg').scaled(50, 50, Qt.IgnoreAspectRatio,
+                                                                        Qt.SmoothTransformation))
+        layout.addWidget(self.pic_label, Qt.AlignCenter)
+        layout.addStretch(2)
+        self.user_name = QLabel("用户登录")
+        self.user_mail = QLabel('邮箱')
+        self.user_mail.setStyleSheet('font-size:16px')
+
+        info_layout.addWidget(self.user_name)
+        info_layout.addWidget(self.user_mail)
+        layout.addLayout(info_layout)
+        layout.addStretch(0)
+
+        self.widget.setLayout(layout)
+        # # 设置自定义的QListWidgetItem的sizeHint，不然无法显示
+        # self.setSizeHint(self.widget.sizeHint())
+
+
+if __name__ == "__main__":
+    app = QApplication(sys.argv)
+    main = User()
+    style_sheet = QSSLoader.read_qss_file('../resource/current.qss')
+    main.setStyleSheet(style_sheet)
+    # print(os.path.abspath('../'))
+
+    app.setWindowIcon(QIcon(os.path.abspath('../') + '/images/todo.svg'))
+    main.show()
+    sys.exit(app.exec_())
diff --git a/view/__init__.py b/view/__init__.py
new file mode 100644
index 0000000..e69de29