Various layout improvements

This commit is contained in:
Sebastian Kügler 2013-11-13 05:28:42 +01:00
parent 95dc36f0ee
commit 4337daa38e
4 changed files with 179 additions and 192 deletions

View File

@ -22,31 +22,139 @@ import org.kde.plasma.components 2.0 as Components
import org.kde.plasma.extras 2.0 as PlasmaExtras
DayStyle {
id: myRectangle
Item {
id: dayStyle
width: cellWidth
height: cellHeight
//property int borderWidth: root.borderWidth
property real borderOpacity: root.borderOpacity
property bool showtop: false
property bool showright: true
property bool showleft: false
property bool showbottom: true
Rectangle {
id: todayRect
x: 0
y: 0
//z: -1
width: parent.width - (borderWidth)
height: parent.height - (borderWidth)
// anchors.fill: parent
opacity: (isToday(dayNumber+"/"+monthNumber+"/"+yearNumber)) ? 0.8 : 0
Behavior on opacity { NumberAnimation {} }
color: theme.highlightColor
//border.color: isToday(dayNumber+"/"+monthNumber+"/"+yearNumber) ? theme.highlightColor : "transparent"
}
Rectangle {
id: highlightDate
anchors {
fill: todayRect
}
opacity: {
if (calendarDays.selectedItem == dayStyle) 0.6
else if (dateMouse.containsMouse) 0.3
else 0
}
//visible: dateMouse.containsMouse
Behavior on opacity { NumberAnimation {} }
color: theme.viewBackgroundColor
z: todayRect.z - 1
//border.color: isToday(dayNumber+"/"+monthNumber+"/"+yearNumber) ? theme.highlightColor : "transparent"
}
// Rectangle {
// id: frameTop
// height: borderWidth
// color: theme.textColor
// opacity: borderOpacity
// visible: showtop
//
// anchors {
// top: parent.top
// left: parent.left
// right: parent.right
// }
// }
Rectangle {
id: frameRight
width: borderWidth
color: theme.textColor
opacity: borderOpacity
visible: showright
anchors {
top: parent.top
bottom: parent.bottom
right: parent.right
}
}
Rectangle {
id: frameBottom
height: borderWidth
color: theme.textColor
opacity: borderOpacity
visible: showbottom
anchors {
bottom: parent.bottom
left: parent.left
right: parent.right
}
}
// Rectangle {
// id: frameLeft
// width: borderWidth
// color: theme.textColor
// opacity: borderOpacity
// visible: showleft
//
// anchors {
// top: parent.top
// left: parent.left
// bottom: parent.bottom
// }
// }
Components.Label {
id: label
anchors.centerIn: parent
//anchors.topMargin: 10
font.pixelSize: Math.max(theme.defaultFont.pixelSize, cellHeight / 3)
text: dayNumber
z: 99
//z: 99
//font.bold: (containsEventItems)||(containsTodoItems) ? true: false
opacity: (isPreviousMonth || isNextMonth) ? 0.5: 1.0
}
MouseArea {
id: dateMouse
anchors.fill: parent
z: label.z + 1
//z: label.z + 1
hoverEnabled: true
onClicked: {
print("Click");
print("date change:" + dayNumber + monthNumber)
var rowNumber = Math.floor ( index / 7) ;
week = 1+monthCalendar.weeksModel[rowNumber];
date = dayNumber + "/" + monthNumber + "/" + yearNumber
calendarDays.selectedItem = myRectangle
//date = dayNumber + "/" + monthNumber + "/" + yearNumber
root.date = model
calendarDays.selectedItem = dayStyle
}
}
Component.onCompleted: {
var t = isToday(dayNumber+"/"+monthNumber+"/"+yearNumber)
if (t) {
root.date = model;
}
}
}

View File

@ -1,126 +0,0 @@
/*
* Copyright 2013 Heena Mahour <heena393@gmail.com>
* Copyright 2013 Sebastian Kügler <sebas@kde.org>
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License as
* published by the Free Software Foundation; either version 2 of
* the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import QtQuick 2.0
import org.kde.plasma.calendar 2.0
import org.kde.plasma.core 2.0 as PlasmaCore
import org.kde.plasma.components 2.0 as Components
import org.kde.plasma.extras 2.0 as PlasmaExtras
Item {
id: dayStyle
//property int borderWidth: root.borderWidth`
property real borderOpacity: 0.2
property bool showtop: false
property bool showright: true
property bool showleft: false
property bool showbottom: true
Rectangle {
id: todayRect
x: 0
y: 0
z: -1
width: parent.width - (borderWidth)
height: parent.height - (borderWidth)
// anchors.fill: parent
opacity: (isToday(dayNumber+"/"+monthNumber+"/"+yearNumber)) ? 0.8 : 0
Behavior on opacity { NumberAnimation {} }
color: theme.highlightColor
//border.color: isToday(dayNumber+"/"+monthNumber+"/"+yearNumber) ? theme.highlightColor : "transparent"
}
Rectangle {
id: highlightDate
anchors {
fill: todayRect
}
opacity: {
if (calendarDays.selectedItem == dayStyle) 0.6
else if (dateMouse.containsMouse) 0.3
else 0
}
//visible: dateMouse.containsMouse
Behavior on opacity { NumberAnimation {} }
color: theme.viewBackgroundColor
z: todayRect.z - 1
//border.color: isToday(dayNumber+"/"+monthNumber+"/"+yearNumber) ? theme.highlightColor : "transparent"
}
// Rectangle {
// id: frameTop
// height: borderWidth
// color: theme.textColor
// opacity: borderOpacity
// visible: showtop
//
// anchors {
// top: parent.top
// left: parent.left
// right: parent.right
// }
// }
Rectangle {
id: frameRight
width: borderWidth
color: theme.textColor
opacity: borderOpacity
visible: showright
anchors {
top: parent.top
bottom: parent.bottom
right: parent.right
}
}
Rectangle {
id: frameBottom
height: borderWidth
color: theme.textColor
opacity: borderOpacity
visible: showbottom
anchors {
bottom: parent.bottom
left: parent.left
right: parent.right
}
}
// Rectangle {
// id: frameLeft
// width: borderWidth
// color: theme.textColor
// opacity: borderOpacity
// visible: showleft
//
// anchors {
// top: parent.top
// left: parent.left
// bottom: parent.bottom
// }
// }
}

View File

@ -21,7 +21,7 @@ import org.kde.plasma.core 2.0 as PlasmaCore
import org.kde.plasma.components 2.0 as Components
import org.kde.plasma.extras 2.0 as PlasmaExtras
Item {
property real borderOpacity: 0.2
property real borderOpacity: root.borderOpacity
Rectangle {
id: frameTop

View File

@ -18,45 +18,51 @@
import QtQuick 2.0
import org.kde.plasma.calendar 2.0
import org.kde.plasma.core 2.0 as PlasmaCore
import org.kde.plasma.components 2.0 as Components
import org.kde.plasma.components 2.0 as PlasmaComponents
import org.kde.plasma.extras 2.0 as PlasmaExtras
Item {
id: root
width: parent.width
height: parent.height
property string date ;
property QtObject date
property date showDate: new Date()
property string selectedMonth
property string selectedYear
property real borderOpacity: 0.2
property alias selectedMonth: monthCalendar.monthName
property alias selectedYear: monthCalendar.year
property alias calendarGrid: calendarGrid
property int mWidth: theme.mSize(theme.defaultFont).width
property int mHeight: theme.mSize(theme.defaultFont).height
property int borderWidth: 1
property alias startDate: monthCalendar.startDate
property int columns: monthCalendar.days
property int rows: monthCalendar.weeks
property int cellWidth: prefCellWidth()
property int cellHeight: prefCellHeight()
property int miniumWidth: implicitWidth
property int miniumHeight: implicitHeight
property int implicitWidth: theme.mSize(theme.defaultFont).width * 6 * 8
property int implicitHeight: theme.mSize(theme.defaultFont).height * 2 * 9
// property int miniumWidth: implicitWidth
// property int miniumHeight: implicitHeight
// property int implicitWidth: theme.mSize(theme.defaultFont).width * 6 * 8
// property int implicitHeight: theme.mSize(theme.defaultFont).height * 2 * 9
property Item selectedItem
property int week;
property int firstDay: new Date(showDate.getFullYear(), showDate.getMonth(), 1).getDay()
anchors.margins: theme.largeSpacing * 3
anchors.margins: borderWidth
function prefCellWidth() {
return Math.min(
Math.max(
mWidth * 4,
mWidth * 3,
calendarGrid.width / (root.columns)
),
mWidth * 100
@ -89,39 +95,6 @@ Item {
return Qt.formatDate(d, "dddd dd MMM yyyy");
}
PlasmaExtras.Heading {
id: monthHeading
anchors {
top: parent.top
left: calendarGrid.left
leftMargin: -borderWidth
}
level: 1
opacity: 0.8
text: monthCalendar.monthName + ", " + monthCalendar.year
MouseArea {
id: month
width: monthHeading.paintedWidth
anchors {
left: parent.left
top: parent.top
bottom: parent.bottom
}
anchors.fill: parent
Loader {
id: menuLoader
}
onClicked: {
if (menuLoader.source == "") {
menuLoader.source = "MonthMenu.qml"
}
menuLoader.item.open(0, height);
}
}
}
Calendar {
id: monthCalendar
@ -129,12 +102,6 @@ Item {
weeks: 6
startDay: 1
startDate: isTodayMonth();
onStartDateChanged: {
selectedMonth = monthName
selectedYear = year
monthHeading.text = selectedMonth + ", " + year;
//monthYear.text = year
}
}
// CalendarToolbar {
@ -144,17 +111,54 @@ Item {
DaysCalendar {
id: calendarGrid
anchors {
top: monthHeading.bottom
left: parent.left
right: parent.right
bottom: calendarToolbar.top
margins: theme.largeSpacing
bottomMargin: theme.largeSpacing * 3
topMargin: - (theme.largeSpacing / 2)
fill: parent
leftMargin: borderWidth
}
PlasmaComponents.Label {
text: "◀"
//x: spacing / 2
opacity: leftmouse.containsMouse ? 0.5 : 0.2
Behavior on opacity { NumberAnimation {} }
anchors {
top: parent.top
left: parent.left
leftMargin: spacing / 2
}
MouseArea {
id: leftmouse
anchors.fill: parent
anchors.margins: -spacing / 3
hoverEnabled: true
onClicked: {
monthCalendar.previousMonth()
}
}
}
PlasmaComponents.Label {
text: "▶"
opacity: rightmouse.containsMouse ? 0.5 : 0.2
Behavior on opacity { NumberAnimation {} }
anchors {
top: parent.top
right: parent.right
rightMargin: spacing / 2
}
MouseArea {
id: rightmouse
anchors.fill: parent
anchors.margins: -spacing / 3
hoverEnabled: true
onClicked: {
monthCalendar.nextMonth()
}
}
}
}
/*
Item {
id: calendarToolbar
visible: false
@ -165,7 +169,7 @@ Item {
bottom: parent.bottom
}
Components.ToolButton {
PlasmaComponents.ToolButton {
id: currentDate
iconSource: "view-pim-calendar"
width: height
@ -182,7 +186,7 @@ Item {
}
}
Components.TextField {
PlasmaComponents.TextField {
id: dateField
text: date == "" ? Qt.formatDateTime ( new Date(), "d/M/yyyy" ): date
width: calendarOperations.width/3
@ -194,7 +198,7 @@ Item {
}
}
Components.TextField {
PlasmaComponents.TextField {
id: weekField
text: week == 0 ? monthCalendar.currentWeek(): week
width: calendarOperations.width/10
@ -203,4 +207,5 @@ Item {
}
}
}
*/
}