css - 如何设置 SmartGwt 日历的样式

Question

我如何修改智能 GWT 日历的行为，以便在单击日期单元格时，它保持选中状态(突出显示)

我知道我必须以某种方式修改 dayBodyClickedHandler 中的 day 单元格的 css

但是我不知道怎么办。有没有人有这方面的例子？

Answer 1

对应的css大概是.calendarCellSelected{}

您可以设置 CSS 样式的名称:calendar.setSelectedCellStyle(selectedCellStyle)

您可以在主题中查找日历的标准 CSS。例如在 BlackOps 中:

/*============================================================
    Calendar

============================================================*/
.calendar,
.calendarDisabled,
.calendarWorkday,
.calendarDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#ffffff;
}

.calendarDisabled {
    background-color:gainsboro;    
}

.calendarWorkday {
    background-color:#ffffcc; 
}

.calendarOver,
.calendarOverDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#c0ffc0;
}
.calendarCellSelected {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#CCCCCC; 
}
.labelColumn {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:gainsboro;
}
/* ----month---- */
/* calMonthDayHeader and Body */

.calMonthDayHeader,
.calMonthDayHeaderDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color: gainsboro;
}

.calMonthDayHeaderOver,
.calMonthDayHeaderOverDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color: #c0ffc0;
}
.calMonthDayBody,
.calMonthDayBodyDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#ffffff;
}
.calMonthDayBodyOver,
.calMonthDayBodyOverDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#c0ffc0;
}

.calMonthDayBodyDisabled,
.calMonthDayBodyDisabledOver {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#E6E6E6;
}
/* calMonthOtherDayHeader and Body */

.calMonthOtherDayHeader,
.calMonthOtherDayHeaderDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:#444444;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color: #aaaaaa;
}
.calMonthOtherDayHeaderOver,
.calMonthOtherDayHeaderOverDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:#444444;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color: #c0ffc0;
}
.calMonthOtherDayBody,
.calMonthOtherDayBodyDark, 
.calMonthOtherDayBodyDisabled, 
.calMonthOtherDayBodyDisabledOver {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#E6E6E6;
}
.calMonthOtherDayBodyOver,
.calMonthOtherDayBodyOverDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:black;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color:#c0ffc0;
}
/* calMonthOtherDayBlank */

.calMonthOtherDayBlank,
.calMonthOtherDayBlankDark, 
.calMonthOtherDayBlankOver,
.calMonthOtherDayBlankOverDark {
    font-family:Arial,sans-serif; font-size:11px;
    color:#444444;
    border-bottom:1px solid #a0a0a0; border-right:1px solid #a0a0a0;
    background-color: #E6E6E6;
}

/* calMonthEventLink */

a.calMonthEventLink:link {color:blue; text-decoration:none}
a.calMonthEventLink:visited {color:blue; text-decoration:none}
a.calMonthEventLink:hover {color:blue; text-decoration:underline}
a.calMonthEventLink:active {color:blue; text-decoration:none}

/* ----event window---- */

.eventWindow {
    font-family:Verdana,Bitstream Vera Sans,sans-serif; font-size: 9px;
    background-color:#649ED8;
    border: 1px solid #004D99;
}

.eventWindowHeader {
    font-family:Verdana,Bitstream Vera Sans,sans-serif; font-size: 9px;
    color:white;
    background-color:#004D99;
}

.eventWindowBody {
    font-family:Verdana,Bitstream Vera Sans,sans-serif; font-size: 9px;
    color:black;
    background-color: #649ED8;
    padding: 3px;
}

.eventWindowResizer{
    border-top:1px solid white;
    border-bottom: 1px solid white;
}