From 4a598ca52b72e4a89e78b27a89670cfc481de1e2 Mon Sep 17 00:00:00 2001 From: syauqijan <13521014@std.stei.itb.ac.id> Date: Thu, 6 Apr 2023 15:40:09 +0700 Subject: [PATCH] feat: customize workout --- img/{Vector.png => add button.png} | Bin src/customize.py | 310 +++++++++++++++++++++-------- 2 files changed, 224 insertions(+), 86 deletions(-) rename img/{Vector.png => add button.png} (100%) diff --git a/img/Vector.png b/img/add button.png similarity index 100% rename from img/Vector.png rename to img/add button.png diff --git a/src/customize.py b/src/customize.py index 591d780..b8fa2d7 100644 --- a/src/customize.py +++ b/src/customize.py @@ -1,34 +1,59 @@ import sqlite3 import sys -from PyQt6.QtCore import Qt -from PyQt6.QtGui import QIcon, QPixmap, QCursor, QFont +from PyQt6.QtCore import Qt, QSize, QPropertyAnimation, QAbstractAnimation, QEasingCurve, QAnimationGroup +from PyQt6.QtGui import QIcon, QPixmap, QCursor, QFont, QMovie from PyQt6.QtWidgets import (QApplication, QMainWindow, QWidget, QGridLayout, QGroupBox, QRadioButton, QCheckBox, QMessageBox, - QLabel, QLineEdit, QVBoxLayout, QPushButton, QScrollArea) + QLabel, QLineEdit, QVBoxLayout, QPushButton, QScrollArea, QGraphicsOpacityEffect) background = '#5A8D6C' button_color = '#174728' text_color = '#EEEEE2' -card_color = '#D2DCC4' +cardColor = '#D2DCC4' class customizeWorkout(QWidget): def __init__(self): - super().__init__() + super().__init__() + self.con = sqlite3.connect('fitu.db') + self.listEx = self.fetchListEx() self.setupGUI() + def fetchListEx(self): + cur = self.con.cursor() + rows = cur.execute("SELECT * FROM daftar_latihan") + rows = cur.fetchall() + cur.close() + + return rows + def setupGUI(self): self.label = QLabel("") self.label.setParent(self) self.setFixedSize(1280, 720) - self.setWindowTitle("FIT-U") + self.setWindowTitle("FIT-U - Customize Workout") self.setStyleSheet("background-color: #5A8D6C;") self.elements() + def exLabel(self): + exLabel = QLabel() + + exLabel.setFixedSize(367, 99) + exLabel.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;") + exLabel1 = QLabel(exLabel) + exLabel1.move(10, 10) + exLabel1.setFixedSize(79, 79) + exLabel1.setStyleSheet(f''' + border: none; + "background-color: #D2DCC4;" + "border-radius: 20px;" + + ''') + def elements(self): buttonFont = QFont() buttonFont.setFamily('Segoe UI') @@ -69,7 +94,31 @@ class customizeWorkout(QWidget): "background-color: #D2DCC4;" "border-radius: 20px;" ) - + # Mengatur bentuk scroll bar + scroll_bar_style = """ + QScrollBar:vertical { + background-color: white; + width: 8px; + margin: 20px 0 20px 0; + } + QScrollBar::handle:vertical { + background-color: #174728; + border-radius: 3px; + + } + QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { + height: 20px; + background-color: #D2DCC4; + subcontrol-origin: margin; + subcontrol-position: top; + } + QScrollBar::add-line:vertical { + top: 0; + } + QScrollBar::sub-line:vertical { + bottom: 0; + } + """ #NAVBAR # masukkan logo logo = QLabel(self) @@ -82,13 +131,13 @@ class customizeWorkout(QWidget): homeButton.setStyleSheet(f''' QPushButton {{ color: {text_color}; - background-color: {button_color}; + background-color: {background}; border: none; border-radius: 20px; }} ''') homeButton.setFont(buttonFont) - homeButton.setFixedSize(96, 42) #pake ini buat kalau dia buletan + # homeButton.setFixedSize(96, 42) #pake ini buat kalau dia buletan homeButton.move(507, 53) homeButton.setCursor( QCursor(Qt.CursorShape.PointingHandCursor)) @@ -99,13 +148,14 @@ class customizeWorkout(QWidget): customizeButton.setStyleSheet(f''' QPushButton {{ color: {text_color}; - background-color: {background}; + background-color: {button_color}; border: none; border-radius: 20px; }} ''') customizeButton.setFont(buttonFont) - customizeButton.move(649, 58) + customizeButton.setFixedSize(120, 42) + customizeButton.move(649, 53) customizeButton.setCursor( QCursor(Qt.CursorShape.PointingHandCursor)) @@ -161,118 +211,206 @@ class customizeWorkout(QWidget): profilePhoto = QLabel(self) profilePhoto.setPixmap(QPixmap('img/profile-dashboard.png')) profilePhoto.move(1133, 45) - #Membuat scroll area - - # scroll.setWidgetResizable(True) + #greenCard greenCard = QLabel(self) - greenCard.move(116.67, 155.33) - greenCard.setFixedSize(429.79, 534.56) + greenCard.move(116, 155) + greenCard.setFixedSize(430, 534) greenCard.setStyleSheet(styleSheet) - # scroll.setWidget(greenCard) scroll = QScrollArea(self) - scroll.setGeometry(130, 250, 410, 429) # mengatur posisi dan ukuran QScrollArea + scroll.setWidgetResizable(True) + scroll.setGeometry(130, 250, 410, 429) scroll.setStyleSheet("background-color: #D2DCC4;border-radius: none;") scrollWidget = QWidget(scroll) scrollLayout = QVBoxLayout(scrollWidget) scrollWidget.setStyleSheet("background-color: #D2DCC4; border-radius: 20px;") scrollWidget.setLayout(scrollLayout) - vertical_scrollbar = scroll.verticalScrollBar() - # Mengatur bentuk scroll bar - scroll_bar_style = """ - QScrollBar:vertical { - background-color: #D2DCC4; - width: 20px; - margin: 20px 0 20px 0; - } - QScrollBar::handle:vertical { - background-color: #5A8D6C; - border-radius: 10px; - } - QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical { - height: 20px; - background-color: #D2DCC4; - subcontrol-origin: margin; - subcontrol-position: top; - } - QScrollBar::add-line:vertical { - top: 0; - } - QScrollBar::sub-line:vertical { - bottom: 0; - } - """ + scroll.verticalScrollBar().setStyleSheet(scroll_bar_style) - for i in range(20): - exLabel = QLabel() - - exLabel.setFixedSize(366.67, 99.33) + addButtonList = [] + exLabelList = [] + count = 0 + for i in range(16): + exLabel = QLabel(self) + exLabel.setFixedSize(367, 99) exLabel.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;") exLabel1 = QLabel(exLabel) exLabel1.move(10, 10) - exLabel1.setFixedSize(78.89, 78.89) + exLabel1.setFixedSize(79, 79) exLabel1.setStyleSheet(styleSheet5) + #add gif + gif = QMovie('img/exercise-unscreen.gif') + exLabel1.setMovie(gif) + gif.start() + gif.setScaledSize(QSize(79, 79)) + gif.setSpeed(100) + + addButton = QPushButton(exLabel) + addButton.setIcon(QIcon('img/add button.png')) + addButton.setIconSize(QPixmap('img/add button.png').size()) + addButton.setGeometry(320, 55, 36, 36) + addButton.move(320, 55) + addButton.setCursor( + QCursor(Qt.CursorShape.PointingHandCursor)) + # Tambahkan addButton ke dalam list + addButtonList.append(addButton) + exLabelList.append(exLabel) + # Hubungkan fungsi handleButtonClicked ke addButton + addButton.clicked.connect(lambda checked, index=i: handleButtonClicked(index, addButtonList)) + # addButton.clicked.connect(lambda checked, index=i: handleButtonClicked2(index, addButtonList)) + title = QLabel(exLabel) + # title.setText(f'<b><p><font style="font-size:24px;" color="#D2DCC4">{self.listEx[i][1]}</font><tab></p></b> <b><p><font color="#D2DCC4" style="font-size:14px;">{self.listEx[i][4]} Repetisi</font></p><b>') + title.setText(f'<font style="font-size:24px;" color="#D2DCC4"; font-family="Sogoe UI";><b>{self.listEx[count][1]}<b>') + title.move(100, 15) + repDur = QLabel(exLabel) + if(count<8): + repDur.setText(f'<font style="font-size:14px;" color="#D2DCC4"; font-family="Sogoe UI";><b>{self.listEx[count][4]} Detik<b>') + repDur.move(100, 60) + else: + repDur.setText(f'<font style="font-size:14px;" color="#D2DCC4"; font-family="Sogoe UI";><b>{self.listEx[count][5]} Repetisi<b>') + repDur.move(100,60) scrollLayout.addWidget(exLabel) - + + addButton.setCursor( + QCursor(Qt.CursorShape.PointingHandCursor)) + count+=1 scroll.setWidget(scrollWidget) - - # mengatur teks pada QLabel - # greenCard.setText("Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend tortor id lacus finibus, at luctus mi aliquet. Donec vel ligula vel augue vehicula vestibulum sed eu lacus. Ut interdum, sapien id aliquet consectetur, eros ipsum faucibus est, in auctor sapien arcu vel leo. Morbi et velit vel lacus semper pharetra. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Aliquam euismod nunc et blandit vehicula. Morbi id turpis id odio vulputate pellentesque vel vel quam. Proin eget sapien feugiat, commodo nibh a, dictum massa. Integer non ante mi. Vivamus suscipit eros at faucibus consequat. Nunc vestibulum nibh quam, in bibendum turpis laoreet quis. Duis hendrerit nisi quis tellus interdum, vel hendrerit tellus venenatis. Donec rhoncus bibendum rutrum.") #greenCard2 greenCard2 = QLabel(self) - greenCard2.move(577.33, 155.33) - greenCard2.setFixedSize(604.67, 534.67) + greenCard2.move(577, 155) + greenCard2.setFixedSize(604, 534) greenCard2.setStyleSheet(styleSheet) + scroll2 = QScrollArea(self) + scroll2.setWidgetResizable(True) + scroll2.setGeometry(620, 250, 410, 429) # mengatur posisi dan ukuran QScrollArea + scroll2.setStyleSheet("background-color: #D2DCC4;border-radius: none;") + scrollWidget2 = QWidget(scroll2) + scrollLayout2 = QVBoxLayout(scrollWidget2) + scrollWidget2.setStyleSheet("background-color: #D2DCC4; border-radius: 20px;") + scrollWidget2.setLayout(scrollLayout2) + scroll2.verticalScrollBar().setStyleSheet(scroll_bar_style) + scroll2.setWidget(scrollWidget2) + def handleButtonClicked(i, buttonList): + button = buttonList[i] + button.setEnabled(False) + button.setIcon(QIcon('img/check button.png')) + button.setIconSize(QPixmap('img/check button.png').size()) + exLabel = QLabel(self ) + exLabel.setFixedSize(367, 99) + exLabel.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;") + exLabel1 = QLabel(exLabel) + exLabel1.move(10, 10) + exLabel1.setFixedSize(79, 79) + exLabel1.setStyleSheet(styleSheet5) + #add gif + gif = QMovie('img/exercise-unscreen.gif') + exLabel1.setMovie(gif) + gif.start() + gif.setScaledSize(QSize(79, 79)) + gif.setSpeed(100) + title = QLabel(exLabel) + title.setText(f'<b><p><font style="font-size:24px;" color="#D2DCC4">{self.listEx[i][1]}</font><tab></p></b> <b><p><font color="#D2DCC4" style="font-size:14px;">{self.listEx[i][4]} Repetisi</font></p><b>') + title.move(100, 15) + deleteButton = QPushButton(exLabel) + deleteButton.setIcon(QIcon('img/delete button.png')) + deleteButton.setIconSize(QPixmap('img/delete button.png').size()) + deleteButton.setGeometry(320, 55, 36, 36) + deleteButton.move(320, 55) + deleteButton.setCursor( + QCursor(Qt.CursorShape.PointingHandCursor)) + deleteButton.clicked.connect(lambda checked, index=i: handleDeleteButtonClicked(index, exLabel, scrollLayout2)) + scrollLayout2.addWidget(exLabel) + + def handleDeleteButtonClicked(index, exLabel, layout): + # item = scrollLayout2.itemAt(index) + # if item is not None: + # widget = item.widget() + # if widget is not None: + # widget.deleteLater() + # # setelah exLabel dihapus, kita perlu mengupdate addButtonList + # for i, button in enumerate(addButtonList): + # if i == index: + # button.setEnabled(True) + # button.setIcon(QIcon('img/add button.png')) + # button.setIconSize(QPixmap('img/add button.png').size()) + + exLabel.setParent(None) + layout.removeWidget(exLabel) + exLabel.deleteLater() + for i, button in enumerate(addButtonList): + if i == index: + button.setEnabled(True) + button.setIcon(QIcon('img/add button.png')) + button.setIconSize(QPixmap('img/add button.png').size()) font = QFont() font.setFamily("Segoe UI") - font.setPointSize(30) + font.setPointSize(28) font.setBold(True) + #font save font1 = QFont() font1.setFamily("Segoe UI") - font1.setPointSize(26) - font1.setWeight(450) + font1.setPointSize(23) + font1.setBold(True) exText = QLabel(self) exText.setText("Exercise") exText.setFont(font) exText.setStyleSheet(styleSheet2) - exText.setFixedSize(164.72, 35) - exText.move(145.7,194) + exText.setFixedSize(165, 35) + exText.move(140,185) progText = QLabel(self) progText.setText("Program Name:") progText.setStyleSheet(styleSheet2) - progText.setFixedSize(361.33, 50) + progText.setFixedSize(361, 50) progText.setFont(font1) - progText.move(592, 182.33) + progText.move(599, 182) - textBox = QLineEdit(self) - textBox.move(840, 194) - textBox.setFixedSize(320, 41.33) - textBox.setStyleSheet(styleSheet3) - - vbox = QVBoxLayout() - vbox.addWidget(textBox) - - save = QPushButton(self) - save.setText("Save") - save.move(1026.67, 618) - save.setFixedSize(112, 42) - save.setStyleSheet(styleSheet4) - save.setFont(font1) - - exLabel = QLabel(self) - exLabel.move(714.67, 260) - exLabel.setFixedSize(366.67, 99.33) - exLabel.setStyleSheet(styleSheet3) - - exLabel1 = QLabel(self) - exLabel1.move(727.59, 270.2) - exLabel1.setFixedSize(78.89, 78.89) - exLabel1.setStyleSheet(styleSheet5) - + progNameInput = QLineEdit(self) + progNameInput.move(840, 189) + progNameInput.setFixedSize(320, 41) + progNameInput.setFont(QFont("Segoe UI", 14)) + progNameInput.setStyleSheet(''' + padding: 11px 30px 11px 30px; + border: 1px solid rgba(255, 255, 255, 0.8); + border-radius: 20px; + color: #D2DCC4; + background-color: {background}; + } + QLineEdit::focus { + color: white; + selection-color: black; + selection-background-color: white; + } + ''') + + saveButton = QPushButton(self) + saveButton.setText('Save') + saveButton.setStyleSheet(f''' + QPushButton {{ + color: {text_color}; + background-color: {button_color}; + border: none; + border-radius: 20px; + }} + ''') + saveButton.setFont(buttonFont) + saveButton.setFixedSize(95, 42) + saveButton.move(1065, 635) + saveButton.setCursor( + QCursor(Qt.CursorShape.PointingHandCursor)) + # saveButton.clicked.connect(self.customize) + # def customize(self): + # c = self.conn.cursor() + # if (progNameInput == "" or scrollLayout2 == ""): + # QMessageBox.about(self, "Error", "Please fill all the fields") + # else: + # c.execute( + # f"INSERT INTO program (program_id, title_program) VALUES ('{progNameInput.text()}')" + # ) + if __name__ == '__main__': app = QApplication(sys.argv) ex = customizeWorkout() -- GitLab