Add Avatar settings editor

This commit is contained in:
johanneshilden 2017-09-28 18:12:28 +03:00
parent c9a1f772b3
commit f994eb0d68
6 changed files with 287 additions and 3 deletions

View File

@ -0,0 +1,104 @@
#include "avatarsettingseditor.h"
#include <QColorDialog>
#include "qtmaterialavatar.h"
AvatarSettingsEditor::AvatarSettingsEditor(QWidget *parent)
: QWidget(parent),
ui(new Ui::AvatarSettingsForm),
m_avatar(new QtMaterialAvatar(QChar('X')))
{
QVBoxLayout *layout = new QVBoxLayout;
setLayout(layout);
QWidget *widget = new QWidget;
layout->addWidget(widget);
QWidget *canvas = new QWidget;
canvas->setStyleSheet("QWidget { background: white; }");
layout->addWidget(canvas);
ui->setupUi(widget);
layout->setContentsMargins(20, 20, 20, 20);
layout = new QVBoxLayout;
canvas->setLayout(layout);
layout->addWidget(m_avatar);
layout->setAlignment(m_avatar, Qt::AlignCenter);
setupForm();
connect(ui->disabledCheckBox, SIGNAL(toggled(bool)), this, SLOT(updateWidget()));
connect(ui->useThemeColorsCheckBox, SIGNAL(toggled(bool)), this, SLOT(updateWidget()));
connect(ui->sizeSpinBox, SIGNAL(valueChanged(int)), this, SLOT(updateWidget()));
connect(ui->typeComboBox, SIGNAL(currentIndexChanged(int)), this, SLOT(updateWidget()));
connect(ui->backgroundColorToolButton, SIGNAL(pressed()), this, SLOT(selectColor()));
connect(ui->textColorToolButton, SIGNAL(pressed()), this, SLOT(selectColor()));
ui->sizeSpinBox->setRange(5, 300);
}
AvatarSettingsEditor::~AvatarSettingsEditor()
{
delete ui;
}
void AvatarSettingsEditor::setupForm()
{
switch (m_avatar->type())
{
case Material::LetterAvatar:
ui->typeComboBox->setCurrentIndex(0);
break;
case Material::ImageAvatar:
ui->typeComboBox->setCurrentIndex(1);
break;
case Material::IconAvatar:
ui->typeComboBox->setCurrentIndex(2);
break;
default:
break;
}
ui->disabledCheckBox->setChecked(!m_avatar->isEnabled());
ui->useThemeColorsCheckBox->setChecked(m_avatar->useThemeColors());
ui->sizeSpinBox->setValue(m_avatar->size());
}
void AvatarSettingsEditor::updateWidget()
{
switch (ui->typeComboBox->currentIndex())
{
case 0:
m_avatar->setLetter(QChar('X'));
break;
case 1:
m_avatar->setImage(QImage(":/images/assets/sikh.jpg"));
break;
case 2:
m_avatar->setIcon(QIcon(":/icons/assets/ic_message_24px.svg"));
break;
default:
break;
}
m_avatar->setDisabled(ui->disabledCheckBox->isChecked());
m_avatar->setUseThemeColors(ui->useThemeColorsCheckBox->isChecked());
m_avatar->setSize(ui->sizeSpinBox->value());
}
void AvatarSettingsEditor::selectColor()
{
QColorDialog dialog;
if (dialog.exec()) {
QColor color = dialog.selectedColor();
QString senderName = sender()->objectName();
if ("textColorToolButton" == senderName) {
m_avatar->setTextColor(color);
ui->textColorLineEdit->setText(color.name(QColor::HexRgb));
} else if ("backgroundColorToolButton" == senderName) {
m_avatar->setBackgroundColor(color);
ui->backgroundColorLineEdit->setText(color.name(QColor::HexRgb));
}
}
setupForm();
}

View File

@ -0,0 +1,27 @@
#ifndef AVATARSETTINGSEDITOR_H
#define AVATARSETTINGSEDITOR_H
#include <QWidget>
#include "ui_avatarsettingsform.h"
class QtMaterialAvatar;
class AvatarSettingsEditor : public QWidget
{
Q_OBJECT
public:
explicit AvatarSettingsEditor(QWidget *parent = 0);
~AvatarSettingsEditor();
protected slots:
void setupForm();
void updateWidget();
void selectColor();
private:
Ui::AvatarSettingsForm *const ui;
QtMaterialAvatar *const m_avatar;
};
#endif // AVATARSETTINGSEDITOR_H

View File

@ -0,0 +1,137 @@
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>AvatarSettingsForm</class>
<widget class="QWidget" name="AvatarSettingsForm">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>400</width>
<height>300</height>
</rect>
</property>
<property name="windowTitle">
<string>Form</string>
</property>
<widget class="QWidget" name="formLayoutWidget">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>221</width>
<height>231</height>
</rect>
</property>
<layout class="QFormLayout" name="formLayout">
<item row="1" column="0">
<widget class="QLabel" name="useThemeColorsLabel">
<property name="text">
<string>Use theme colors</string>
</property>
</widget>
</item>
<item row="1" column="1">
<widget class="QCheckBox" name="useThemeColorsCheckBox"/>
</item>
<item row="2" column="0">
<widget class="QLabel" name="textColorLabel">
<property name="text">
<string>Text color</string>
</property>
</widget>
</item>
<item row="2" column="1">
<layout class="QHBoxLayout" name="horizontalLayout_4">
<item>
<widget class="QLineEdit" name="textColorLineEdit">
<property name="enabled">
<bool>false</bool>
</property>
</widget>
</item>
<item>
<widget class="QToolButton" name="textColorToolButton">
<property name="text">
<string>...</string>
</property>
</widget>
</item>
</layout>
</item>
<item row="3" column="0">
<widget class="QLabel" name="backgroundColorLabel">
<property name="text">
<string>Background color</string>
</property>
</widget>
</item>
<item row="3" column="1">
<layout class="QHBoxLayout" name="horizontalLayout_5">
<item>
<widget class="QLineEdit" name="backgroundColorLineEdit">
<property name="enabled">
<bool>false</bool>
</property>
</widget>
</item>
<item>
<widget class="QToolButton" name="backgroundColorToolButton">
<property name="text">
<string>...</string>
</property>
</widget>
</item>
</layout>
</item>
<item row="4" column="0">
<widget class="QLabel" name="sizeLabel">
<property name="text">
<string>Size</string>
</property>
</widget>
</item>
<item row="4" column="1">
<widget class="QSpinBox" name="sizeSpinBox"/>
</item>
<item row="5" column="0">
<widget class="QLabel" name="typeLabel">
<property name="text">
<string>Type</string>
</property>
</widget>
</item>
<item row="5" column="1">
<widget class="QComboBox" name="typeComboBox">
<item>
<property name="text">
<string>Letter</string>
</property>
</item>
<item>
<property name="text">
<string>Image</string>
</property>
</item>
<item>
<property name="text">
<string>Icon</string>
</property>
</item>
</widget>
</item>
<item row="0" column="0">
<widget class="QLabel" name="disabledLabel">
<property name="text">
<string>Disabled</string>
</property>
</widget>
</item>
<item row="0" column="1">
<widget class="QCheckBox" name="disabledCheckBox"/>
</item>
</layout>
</widget>
</widget>
<resources/>
<connections/>
</ui>

View File

@ -1,8 +1,15 @@
QT += core gui widgets
TEMPLATE = app
SOURCES = mainwindow.cpp main.cpp
HEADERS = mainwindow.h
SOURCES = \
mainwindow.cpp \
main.cpp \
avatarsettingseditor.cpp
HEADERS = \
mainwindow.h \
avatarsettingseditor.h
LIBS += ../components/libcomponents.a
INCLUDEPATH += ../components/
TARGET = ../examples-exe
RESOURCES += resources.qrc
RESOURCES += resources.qrc
FORMS += \
avatarsettingsform.ui

View File

@ -1,10 +1,12 @@
#include "mainwindow.h"
#include <QtWidgets/QVBoxLayout>
#include <qtmaterialavatar.h>
#include "avatarsettingseditor.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
{
/*
QtMaterialAvatar *avatars[3];
avatars[0] = new QtMaterialAvatar(QImage("../qt-material-widgets/examples/assets/uxceo-128.jpg"));
avatars[1] = new QtMaterialAvatar('W');
@ -19,6 +21,10 @@ MainWindow::MainWindow(QWidget *parent)
layout->addWidget(avatars[0]);
layout->addWidget(avatars[1]);
layout->addWidget(avatars[2]);
*/
AvatarSettingsEditor *editor = new AvatarSettingsEditor;
setCentralWidget(editor);
}
MainWindow::~MainWindow()

View File

@ -2,4 +2,7 @@
<qresource prefix="/icons">
<file>assets/ic_message_24px.svg</file>
</qresource>
<qresource prefix="/images">
<file>assets/sikh.jpg</file>
</qresource>
</RCC>