3

我想在工作日和周末的 DateChooser / CalendarLayout 中看到不同的颜色。我还想使用自定义样式名来实现这一点（例如：“weekColor”和“weekendColor”。

知道如何实现吗？

干杯，瑞克

4

2 回答 2

3

我花了几天时间，但我发现了。所以供将来参考：这是我的解决方案：

我扩展了 DateChooser 并在函数 updateDisplayList(w:Number, h:Number) 上添加了一个覆盖（在此函数中，已设置 SMTWTFS 日期名称）。

在 updateDisplayList 中，您可以获得包含 CalendarLayout 的所有值的 mx_internal::dateGrid.dayBlockArrays[column][row]。在该数组/数组中，每列的第一行是 SMTWTFS 天数。其他行是 dayNumbers。一旦我发现这是确定周末是什么并相应地调整颜色的问题。如下所示：

override protected function updateDisplayList(w:Number, h:Number):void
    {
        super.updateDisplayList(w, h);



        // Now the dayBlocksArray has been filled. The Array looks as follows 
        // dayBlocksArray["rows"]["columns] .... therefor [i][0 (zero)] will always get the dayNames (SMTWTFS)
        // Compare the dayNames with the set this.dayNames (which always start with sunday) and find the weekend days
        var colIndex:uint = 0;
        var rowIndex:uint = 1; // The first row (SMTWTFS) is handled seperately
        var currentColumn:Array;
        var dayName:UITextField;
        var backgroundColor:uint = this.getStyle("dayNamesBackgroundColor");
        var isWeekendCol:Boolean = false;
        var currentTextFormat:TextFormat;

        // When the style is not found the default of white will be used.
        if (!backgroundColor)
        {
            backgroundColor = 0xFFFFFF;
        }

        for (colIndex; colIndex < 7; colIndex++)
        {
            // First determine if the first item in this row (SMTWTFS) is a week/weekend day
            currentColumn = mx_internal::dateGrid.dayBlocksArray[colIndex];
            dayName = currentColumn[0];

            // Determine if this is a weekend row
            // The dayNames array is fixed in the order of index 0 = sunday and index 6 = saturday. 
            // Therefor check of the text value of the current dayName is equal to either of 
            // those two. If it is we are dealing with a weekend column
            isWeekendCol = dayName.text == this.dayNames[0] || dayName.text == this.dayNames[6];

            if (isWeekendCol)
            {
                // Set the color
                currentTextFormat = dayName.getTextFormat();
                currentTextFormat.color = getStyle("weekendHeaderColor");
                dayName.setTextFormat(currentTextFormat);

                // Set the background color
                dayName.background = true;
                dayName.backgroundColor = backgroundColor;
            }
            else
            {
                currentTextFormat = dayName.getTextFormat();
                currentTextFormat.color = getStyle("weekHeaderColor");
                dayName.setTextFormat(currentTextFormat);

                // Set the background color
                dayName.background = true;
                dayName.backgroundColor = backgroundColor;
            }

            // Reset the rowIndex
            rowIndex = 1;

            // Now go through all the other rows of this column
            for (rowIndex; rowIndex < currentColumn.length; rowIndex++)
            {
                dayName = currentColumn[rowIndex];

                if (isWeekendCol)
                {
                    dayName.setColor(getStyle("weekendColor"));
                }
                else
                {
                    dayName.setColor(getStyle("weekColor"));
                }
            }
        } 
}

在 CSS 文件中，我添加了以下样式：

DateChooser {

角半径：0；标题颜色：#FFFFFF，#FFFFFF；今天颜色：#00448c；边框样式：无；dropShadowEnabled：假；fontFamily: myGeorgia; dayNamesBackgroundColor：#ECECEC；weekHeaderColor:#444444; 周末标题颜色：#DDDDDD; 周颜色：#00317F; 周末颜色：#DDDDDD；headerStyleName: "dateChooserHeaderStyle";
组合框样式名称：“组合框样式名称”；}

这里最有趣的样式是自定义样式“dayNamesBackgroundColor”（用于为 SMTWTFS 集赋予背景颜色）和自定义样式“weekendHeaderColor”、“weekHeaderColor”、“weekColor”、“weekendColor”

我在上面的方法中阅读了这些颜色，以完全控制 SMTWTFS 集可能获得与日期数不同的颜色的周/周末颜色差异

希望这将有助于未来的其他人。我花了很多时间才弄清楚:)

于 2011-05-09T13:49:00.737 回答
2

我为客户做了类似的事情。方法是扩展 CalendarLayout 类以接受这些样式并在相关日期修改样式。然后扩展 DateChooser 以接受这些相同的样式并将它们传递给您的新 CalendarLayout 类。

这很乏味；你很可能会遇到私有变量问题；但这是可行的。

于 2011-05-05T13:01:35.477 回答