diff --git a/client/tp-player/bar.cpp b/client/tp-player/bar.cpp
new file mode 100644
index 0000000..cb034a8
--- /dev/null
+++ b/client/tp-player/bar.cpp
@@ -0,0 +1,57 @@
+#include "bar.h"
+
+#include <QPainter>
+
+Bar::Bar() {
+
+}
+
+Bar::~Bar() {
+
+}
+
+bool Bar::init(QWidget* owner, int width) {
+    m_owner = owner;
+
+    // 加载所需的图像资源
+    if(!m_bg_left.load(":/tp-player/res/bar/bg-left.png")
+            || !m_bg_mid.load(":/tp-player/res/bar/bg-mid.png")
+            || !m_bg_right.load(":/tp-player/res/bar/bg-right.png")
+            || !m_btn_left.load(":/tp-player/res/bar/btn-left.png")
+            || !m_btn_mid.load(":/tp-player/res/bar/btn-mid.png")
+            || !m_btn_right.load(":/tp-player/res/bar/btn-right.png")
+            || !m_btnsel_left.load(":/tp-player/res/bar/btnsel-left.png")
+            || !m_btnsel_mid.load(":/tp-player/res/bar/btnsel-mid.png")
+            || !m_btnsel_right.load(":/tp-player/res/bar/btnsel-right.png")
+            || !m_prgbarh_left.load(":/tp-player/res/bar/prgbarh-left.png")
+            || !m_prgbarh_mid.load(":/tp-player/res/bar/prgbarh-mid.png")
+            || !m_prgbar_left.load(":/tp-player/res/bar/prgbar-left.png")
+            || !m_prgbar_mid.load(":/tp-player/res/bar/prgbar-mid.png")
+            || !m_prgbar_right.load(":/tp-player/res/bar/prgbar-right.png")
+            || !m_prgpt.load(":/tp-player/res/bar/prgpt.png")
+            || !m_prgpt_hover.load(":/tp-player/res/bar/prgpt-hover.png")
+            || !m_select.load(":/tp-player/res/bar/select.png")
+            || !m_selected.load(":/tp-player/res/bar/selected.png")
+            || !m_play.load(":/tp-player/res/bar/play.png")
+            || !m_play_hover.load(":/tp-player/res/bar/play-hover.png")
+    )
+        return false;
+
+    // 创建背景图像
+    m_bg = QPixmap(width, m_bg_left.height());
+    m_bg.fill(Qt::transparent);//用透明色填充
+    QPainter pp(&m_bg);
+    pp.drawPixmap(0, 0, m_bg_left, 0, 0, m_bg_left.width(), m_bg_left.height());
+    pp.drawPixmap(m_bg_left.width(), 0, m_bg.width() - m_bg_left.width() - m_bg_right.width(), m_bg_left.height(), m_bg_mid);
+    pp.drawPixmap(m_bg.width()-m_bg_right.width(), 0, m_bg_right, 0, 0, m_bg_right.width(), m_bg_right.height());
+
+    //pp.drawPixmap(10, 10, m_prgpt, 0, 0, m_prgpt.width(), m_prgpt.height());
+    pp.drawPixmap(10, 10, m_play.width(), m_play.height(), m_play);
+
+
+    return true;
+}
+
+void Bar::draw(QPainter& painter, const QRect& rc){
+    painter.drawPixmap(10, 150, m_bg, 0, 0, m_bg.width(), m_bg.height());
+}
diff --git a/client/tp-player/bar.h b/client/tp-player/bar.h
new file mode 100644
index 0000000..5000069
--- /dev/null
+++ b/client/tp-player/bar.h
@@ -0,0 +1,53 @@
+#ifndef BAR_H
+#define BAR_H
+
+#include <QPainter>
+#include <QPixmap>
+#include <QWidget>
+
+
+class Bar {
+public:
+    Bar();
+    ~Bar();
+
+    bool init(QWidget* owner, int width);
+    void draw(QPainter& painter, const QRect& rc);
+
+private:
+    QWidget* m_owner;
+    int m_width;
+
+
+    QPixmap m_bg;
+
+    QPixmap m_bg_left;
+    QPixmap m_bg_mid;
+    QPixmap m_bg_right;
+
+    QPixmap m_btn_left;
+    QPixmap m_btn_mid;
+    QPixmap m_btn_right;
+
+    QPixmap m_btnsel_left;
+    QPixmap m_btnsel_mid;
+    QPixmap m_btnsel_right;
+
+    QPixmap m_prgbarh_left;
+    QPixmap m_prgbarh_mid;
+
+    QPixmap m_prgbar_left;
+    QPixmap m_prgbar_mid;
+    QPixmap m_prgbar_right;
+
+    QPixmap m_prgpt;
+    QPixmap m_prgpt_hover;
+
+    QPixmap m_select;
+    QPixmap m_selected;
+
+    QPixmap m_play;
+    QPixmap m_play_hover;
+};
+
+#endif // BAR_H
diff --git a/client/tp-player/mainwindow.cpp b/client/tp-player/mainwindow.cpp
index 9748b2c..b2467d0 100644
--- a/client/tp-player/mainwindow.cpp
+++ b/client/tp-player/mainwindow.cpp
@@ -99,6 +99,9 @@ MainWindow::MainWindow(QWidget *parent) :
     setWindowFlags(windowFlags()&~Qt::WindowMaximizeButtonHint);    // 禁止最大化按钮
     setFixedSize(m_bg.width(), m_bg.height());                     // 禁止拖动窗口大小
 
+    if(!m_bar.init(this, 480))
+        return;
+
     connect(&m_thr_play, SIGNAL(signal_update_data(update_data*)), this, SLOT(on_update_data(update_data*)));
 }
 
@@ -117,26 +120,29 @@ void MainWindow::paintEvent(QPaintEvent *pe)
 
     if(!m_pt_history.empty()) {
         for(int i = 0; i < m_pt_history.count(); i++) {
-            qDebug("pt clean %d,%d", m_pt_history[i].x, m_pt_history[i].y);
+            //qDebug("pt clean %d,%d", m_pt_history[i].x, m_pt_history[i].y);
             QRect rcpt(m_pt_normal.rect());
             rcpt.moveTo(m_pt_history[i].x - m_pt_normal.width()/2, m_pt_history[i].y-m_pt_normal.height()/2);
-            painter.drawPixmap(rcpt, m_canvas, rcpt);
+            //painter.drawPixmap(rcpt, m_canvas, rcpt);
+            qDebug("pt ---- (%d,%d), (%d,%d)", rcpt.x(), rcpt.y(), rcpt.width(), rcpt.height());
+            painter.fillRect(rcpt, QColor(255, 255, 0, 128));
         }
         m_pt_history.clear();
     }
 
     QRect rcpt(m_pt_normal.rect());
     rcpt.moveTo(m_pt.x - m_pt_normal.width()/2, m_pt.y-m_pt_normal.height()/2);
-
     if(pe->rect().intersects(rcpt)) {
+        qDebug("pt draw (%d,%d), (%d,%d)", m_pt.x-m_pt_normal.width()/2, m_pt.y-m_pt_normal.height()/2, m_pt_normal.width(), m_pt_normal.height());
         painter.drawImage(m_pt.x-m_pt_normal.width()/2, m_pt.y-m_pt_normal.height()/2, m_pt_normal);
     }
 
+    m_bar.draw(painter, pe->rect());
 
-    if(!m_shown) {
-        m_shown = true;
-        m_thr_play.start();
-    }
+//    if(!m_shown) {
+//        m_shown = true;
+//        m_thr_play.start();
+//    }
 }
 
 void MainWindow::on_update_data(update_data* dat) {
@@ -166,7 +172,7 @@ void MainWindow::on_update_data(update_data* dat) {
 
             // 更新虚拟鼠标信息，这样下一次绘制界面时就会在新的位置绘制出虚拟鼠标
             memcpy(&m_pt, dat->data_buf() + sizeof(TS_RECORD_PKG), sizeof(TS_RECORD_RDP_POINTER));
-            qDebug("pt new position %d,%d", m_pt.x, m_pt.y);
+            //qDebug("pt new position %d,%d", m_pt.x, m_pt.y);
 
             //setUpdatesEnabled(false);
             update(m_pt.x - m_pt_normal.width()/2, m_pt.y - m_pt_normal.width()/2, m_pt_normal.width(), m_pt_normal.height());
@@ -226,9 +232,10 @@ void MainWindow::on_update_data(update_data* dat) {
             setFixedSize(m_rec_hdr.basic.width, m_rec_hdr.basic.height);
             resize(m_rec_hdr.basic.width, m_rec_hdr.basic.height);
 
-//            QDesktopWidget *desktop = QApplication::desktop(); // =qApp->desktop();也可以
-//            //move((desktop->width() - this->width())/2, (desktop->height() - this->height())/2);
-//            move(10, (desktop->height() - this->height())/2);
+            QDesktopWidget *desktop = QApplication::desktop(); // =qApp->desktop();也可以
+            qDebug("desktop width: %d", desktop->width());
+            //move((desktop->width() - this->width())/2, (desktop->height() - this->height())/2);
+            move(10, (desktop->height() - this->height())/2);
         }
 
         QString title;
diff --git a/client/tp-player/mainwindow.h b/client/tp-player/mainwindow.h
index 386010b..f53d309 100644
--- a/client/tp-player/mainwindow.h
+++ b/client/tp-player/mainwindow.h
@@ -3,6 +3,7 @@
 
 #include <QMainWindow>
 #include <QVector>
+#include "bar.h"
 #include "thr_play.h"
 #include "update_data.h"
 #include "record_format.h"
@@ -35,6 +36,8 @@ private:
 
     QPixmap m_canvas;
 
+    Bar m_bar;
+
     bool m_show_bg;
     TS_RECORD_HEADER m_rec_hdr;
 
diff --git a/client/tp-player/res/bar.psd b/client/tp-player/res/bar.psd
new file mode 100644
index 0000000..8348da1
Binary files /dev/null and b/client/tp-player/res/bar.psd differ
diff --git a/client/tp-player/res/bar/bg-left.png b/client/tp-player/res/bar/bg-left.png
new file mode 100644
index 0000000..58f3c21
Binary files /dev/null and b/client/tp-player/res/bar/bg-left.png differ
diff --git a/client/tp-player/res/bar/bg-mid.png b/client/tp-player/res/bar/bg-mid.png
new file mode 100644
index 0000000..870affc
Binary files /dev/null and b/client/tp-player/res/bar/bg-mid.png differ
diff --git a/client/tp-player/res/bar/bg-right.png b/client/tp-player/res/bar/bg-right.png
new file mode 100644
index 0000000..8cbb474
Binary files /dev/null and b/client/tp-player/res/bar/bg-right.png differ
diff --git a/client/tp-player/res/bar/btn-left.png b/client/tp-player/res/bar/btn-left.png
new file mode 100644
index 0000000..d59d51f
Binary files /dev/null and b/client/tp-player/res/bar/btn-left.png differ
diff --git a/client/tp-player/res/bar/btn-mid.png b/client/tp-player/res/bar/btn-mid.png
new file mode 100644
index 0000000..07c0acc
Binary files /dev/null and b/client/tp-player/res/bar/btn-mid.png differ
diff --git a/client/tp-player/res/bar/btn-right.png b/client/tp-player/res/bar/btn-right.png
new file mode 100644
index 0000000..a5e986f
Binary files /dev/null and b/client/tp-player/res/bar/btn-right.png differ
diff --git a/client/tp-player/res/bar/btnsel-left.png b/client/tp-player/res/bar/btnsel-left.png
new file mode 100644
index 0000000..a84e74b
Binary files /dev/null and b/client/tp-player/res/bar/btnsel-left.png differ
diff --git a/client/tp-player/res/bar/btnsel-mid.png b/client/tp-player/res/bar/btnsel-mid.png
new file mode 100644
index 0000000..03c01ea
Binary files /dev/null and b/client/tp-player/res/bar/btnsel-mid.png differ
diff --git a/client/tp-player/res/bar/btnsel-right.png b/client/tp-player/res/bar/btnsel-right.png
new file mode 100644
index 0000000..cfa0078
Binary files /dev/null and b/client/tp-player/res/bar/btnsel-right.png differ
diff --git a/client/tp-player/res/bar/play-hover.png b/client/tp-player/res/bar/play-hover.png
new file mode 100644
index 0000000..a4f6c99
Binary files /dev/null and b/client/tp-player/res/bar/play-hover.png differ
diff --git a/client/tp-player/res/bar/play.png b/client/tp-player/res/bar/play.png
new file mode 100644
index 0000000..66b4bb3
Binary files /dev/null and b/client/tp-player/res/bar/play.png differ
diff --git a/client/tp-player/res/bar/prgbar-left.png b/client/tp-player/res/bar/prgbar-left.png
new file mode 100644
index 0000000..a97797d
Binary files /dev/null and b/client/tp-player/res/bar/prgbar-left.png differ
diff --git a/client/tp-player/res/bar/prgbar-mid.png b/client/tp-player/res/bar/prgbar-mid.png
new file mode 100644
index 0000000..59ac7d7
Binary files /dev/null and b/client/tp-player/res/bar/prgbar-mid.png differ
diff --git a/client/tp-player/res/bar/prgbar-right.png b/client/tp-player/res/bar/prgbar-right.png
new file mode 100644
index 0000000..d7d3f3f
Binary files /dev/null and b/client/tp-player/res/bar/prgbar-right.png differ
diff --git a/client/tp-player/res/bar/prgbarh-left.png b/client/tp-player/res/bar/prgbarh-left.png
new file mode 100644
index 0000000..4f936ff
Binary files /dev/null and b/client/tp-player/res/bar/prgbarh-left.png differ
diff --git a/client/tp-player/res/bar/prgbarh-mid.png b/client/tp-player/res/bar/prgbarh-mid.png
new file mode 100644
index 0000000..17705f7
Binary files /dev/null and b/client/tp-player/res/bar/prgbarh-mid.png differ
diff --git a/client/tp-player/res/bar/prgpt-hover.png b/client/tp-player/res/bar/prgpt-hover.png
new file mode 100644
index 0000000..51cb232
Binary files /dev/null and b/client/tp-player/res/bar/prgpt-hover.png differ
diff --git a/client/tp-player/res/bar/prgpt.png b/client/tp-player/res/bar/prgpt.png
new file mode 100644
index 0000000..0973ffd
Binary files /dev/null and b/client/tp-player/res/bar/prgpt.png differ
diff --git a/client/tp-player/res/bar/select.png b/client/tp-player/res/bar/select.png
new file mode 100644
index 0000000..38a1052
Binary files /dev/null and b/client/tp-player/res/bar/select.png differ
diff --git a/client/tp-player/res/bar/selected.png b/client/tp-player/res/bar/selected.png
new file mode 100644
index 0000000..c0067f5
Binary files /dev/null and b/client/tp-player/res/bar/selected.png differ
diff --git a/client/tp-player/tp-player.pro b/client/tp-player/tp-player.pro
index cb73260..11b66b3 100644
--- a/client/tp-player/tp-player.pro
+++ b/client/tp-player/tp-player.pro
@@ -5,13 +5,16 @@ QT += core gui widgets
 
 HEADERS += \
     mainwindow.h \
+    bar.h \
     thr_play.h \
     update_data.h \
     record_format.h \
     rle.h
 
-SOURCES += main.cpp \
-        mainwindow.cpp \
+SOURCES += \
+    main.cpp \
+    mainwindow.cpp \
+    bar.cpp \
     thr_play.cpp \
     update_data.cpp \
     rle.c
diff --git a/client/tp-player/tp-player.qrc b/client/tp-player/tp-player.qrc
index cccf89b..0322973 100644
--- a/client/tp-player/tp-player.qrc
+++ b/client/tp-player/tp-player.qrc
@@ -2,5 +2,25 @@
     <qresource prefix="/tp-player">
         <file>res/bg.png</file>
         <file>res/cursor.png</file>
+        <file>res/bar/bg-left.png</file>
+        <file>res/bar/bg-mid.png</file>
+        <file>res/bar/bg-right.png</file>
+        <file>res/bar/btn-left.png</file>
+        <file>res/bar/btn-mid.png</file>
+        <file>res/bar/btn-right.png</file>
+        <file>res/bar/btnsel-left.png</file>
+        <file>res/bar/btnsel-mid.png</file>
+        <file>res/bar/btnsel-right.png</file>
+        <file>res/bar/play-hover.png</file>
+        <file>res/bar/play.png</file>
+        <file>res/bar/prgbar-left.png</file>
+        <file>res/bar/prgbar-mid.png</file>
+        <file>res/bar/prgbar-right.png</file>
+        <file>res/bar/prgbarh-left.png</file>
+        <file>res/bar/prgbarh-mid.png</file>
+        <file>res/bar/prgpt-hover.png</file>
+        <file>res/bar/prgpt.png</file>
+        <file>res/bar/select.png</file>
+        <file>res/bar/selected.png</file>
     </qresource>
 </RCC>