Compartir a través de


Selector de colores de Drop-Down

El marco de la cinta de opciones de Windows proporciona un control especializado Drop-Down Selector de colores que expone una variedad de configuraciones de color a través de un botón de división y un selector de color desplegable personalizable.

Introducción

Al simular la apariencia y la funcionalidad del selector de colores de Microsoft Office, el marco de la cinta de opciones puede beneficiarse y contribuir a la coherencia y familiaridad en una amplia gama de aplicaciones.

Margen

Al igual que todos los controles de la cinta de opciones, el selector de colores de Drop-Down se implementa y personaliza fácilmente a través del marcado. El marco proporciona una serie de atributos de elemento para el selector de color de Drop-Down para exponer varios niveles de funcionalidad. En la tabla siguiente se enumeran los atributos Drop-Down Selector de colores.

Atributo Descripción
ColorTemplate Plantillas de diseño que especifican el tipo de selector de color de Drop-Down.
Hay tres plantillas, cada una de las cuales especifica un diseño de control y valores predeterminados para los atributos asociados y las claves de propiedad.
  • ThemeColors
  • StandardColors
  • HighlightColors
ChipSize Tamaño de cada chip de color (o muestra).
  • Small
  • Medium
  • Large
Columnas Número de columnas de chip de color (o muestra).
CommandName Nombre de la declaración Command asociada.
IsAutomaticColorButtonVisible Muestra (u oculta) el botón Automático.
Válido solo cuando ColorTemplate tiene un valor de ThemeColors o StandardColors.
IsNoColorButtonVisible Muestra (u oculta) el botón Sin color.
Válido para todos los valores de ColorTemplate.
RecentColorGridRows Número de filas de chip de color (o muestra) del área Colores recientes.
Válido solo cuando ColorTemplate tiene un valor de ThemeColors.
StandardColorGridRows Número de filas de chip de color (o muestra) del área colores estándar.
ThemeColorGridRows Número de filas de chip de color (o muestra) en el colores del tema área.
Válido solo cuando ColorTemplate tiene un valor de ThemeColors.

Las capturas de pantalla siguientes muestran los diseños predeterminados del selector de colores de Drop-Down para las tres plantillas de color.

     
ThemeColors:[newline] captura de pantalla del elemento dropdowncolorpicker con el atributo colortemplate establecido en [nueva línea] standardcolors:[newline] captura de pantalla del elemento dropdowncolorpicker con el atributo colortemplate establecido en [nueva línea] highlightcolors:[newline] captura de pantalla del elemento dropdowncolorpicker con el atributo colortemplate establecido en

El marcado básico necesario para cada tipo de selector de color de Drop-Down se muestra en los ejemplos siguientes:

Nota

El selector de color de Drop-Down es un control botón de válido en una plantillaSizeDefinition.

<!-- DropDownColorPickers -->
<Command Name="cmdDropDownColorPickerGroup"
         Symbol="cmdDropDownColorPickerGroup"
         Comment="DropDownColorPicker Group"
         Id="55000"/>
<Command Name="cmdDropDownColorPickerThemeColors"
         Symbol="cmdDropDownColorPickerThemeColors"
         Comment="DropDownColorPicker ThemeColors"
         Id="55010"
         LabelTitle="ThemeColors"
         LabelDescription="ThemeColors\ndescription."/>
<Command Name="cmdDropDownColorPickerStandardColors"
         Symbol="cmdDropDownColorPickerStandardColors"
         Comment="DropDownColorPicker StandardColors"
         Id="55011"
         LabelTitle="StandardColors"/>
<Command Name="cmdDropDownColorPickerHighlightColors"
         Symbol="cmdDropDownColorPickerHighlightColors"
         Comment="DropDownColorPicker HighlightColors"
         Id="55012"
         LabelTitle="HighlightColors"/>

<Group CommandName=&quot;cmdDropDownColorPickerGroup&quot;
       SizeDefinition=&quot;ThreeButtons&quot;>
  <DropDownColorPicker
    CommandName=&quot;cmdDropDownColorPickerThemeColors&quot;
    ColorTemplate=&quot;ThemeColors&quot;/>
  <DropDownColorPicker
    CommandName=&quot;cmdDropDownColorPickerStandardColors&quot;
    ColorTemplate=&quot;StandardColors&quot;/>
  <DropDownColorPicker
    CommandName=&quot;cmdDropDownColorPickerHighlightColors&quot;
    ColorTemplate=&quot;HighlightColors&quot;
    StandardColorGridRows=&quot;1&quot;/>
</Group>

Código

Como control especializado que admite la personalización, cualquier implementación del selector de color de Drop-Down que aprovecha estas funcionalidades requiere código de aplicación especializado para administrar propiedades y controlar los comandos emitidos por el control.

Propiedades

El marco de la cinta define una colección de claves de propiedad para el control Selector de color de Drop-Down.

Normalmente, se actualiza una propiedad selector de color de Drop-Down en la interfaz de usuario de la cinta de opciones mediante la invalidación del comando asociado al control a través de una llamada al método IUIFramework::InvalidateUICommand. El evento de invalidación se controla y las actualizaciones de propiedades definidas por el IUICommandHandler::UpdateProperty método de devolución de llamada.

El IUICommandHandler::UpdateProperty método de devolución de llamada no se ejecuta y la aplicación consultada para un valor de propiedad actualizado, hasta que el marco requiera la propiedad. Por ejemplo, cuando se activa una pestaña y se muestra un control en la interfaz de usuario de la cinta de opciones, o cuando se muestra una información sobre herramientas.

Nota

En algunos casos, se puede recuperar una propiedad a través del método IUIFramework::GetUICommandProperty y establecer con el método IUIFramework::SetUICommandProperty.

En la tabla siguiente se enumeran las claves de propiedad asociadas al control selector de color de Drop-Down.

Clave de propiedad Descripción Notas
UI_PKEY_AutomaticColorLabel Define la etiqueta del botón de color automático de.
Solo es válido cuando ColorTemplate tiene un valor de ThemeColors o StandardColors.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_Color Define el valor de color seleccionado como COLORREF.
Solo es válido cuando UI_PKEY_ColorType tiene un valor de UI_SWATCHCOLORTYPE_RGB.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_ColorType Define el tipo de color seleccionado.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_Enabled Define la capacidad de un control para responder a la interacción del usuario.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_Keytip Solo se puede actualizar a través de la invalidación.
UI_PKEY_Label Define la cadena de caracteres para una etiqueta de control.
Solo se puede actualizar a través de la invalidación.
UI_PKEY_LargeHighContrastImage Define la imagen de contraste alto grande que se va a mostrar para un control.
Solo se puede actualizar a través de la invalidación.
Para obtener más información sobre los formatos de imagen, vea Especificar recursos de imagen de la cinta de opciones.
UI_PKEY_LargeImage Define la imagen grande que se va a mostrar para un control.
Solo se puede actualizar a través de la invalidación.
Para obtener más información sobre los formatos de imagen, vea Especificar recursos de imagen de la cinta de opciones.
UI_PKEY_MoreColorsLabel Define la etiqueta del botón Más colores....
Solo es válido cuando ColorTemplate tiene un valor de ThemeColors o StandardColors.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_NoColorLabel Define la etiqueta del botón No color.
Válido para todos los valores de ColorTemplate.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_RecentColorsCategoryLabel Define la etiqueta de la categoría Colores recientes.
Solo es válido cuando ColorTemplate tiene un valor de ThemeColors. Esta es la única plantilla que contiene categorías etiquetadas.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_SmallHighContrastImage Define la imagen de contraste alto pequeña que se va a mostrar para un control.
Solo se puede actualizar a través de la invalidación.
Para obtener más información sobre los formatos de imagen, vea Especificar recursos de imagen de la cinta de opciones.
UI_PKEY_SmallImage Define la imagen pequeña que se va a mostrar para un control.
Solo se puede actualizar a través de la invalidación.
Para obtener más información sobre los formatos de imagen, vea Especificar recursos de imagen de la cinta de opciones.
UI_PKEY_StandardColors Define una matriz de valores COLORREF para las muestras de un selector de color de Drop-Down.
Cada selector de color Drop-Down ColorTemplate contiene una cuadrícula de StandardColors.
Nota: Se muestran los valores COLORREF de la inicial StandardColorGridRows x Columnas de la matriz. Si la matriz define menos colores que el número de muestras de StandardColors declaradas en marcado, se muestran espacios vacíos para los chips que faltan.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_StandardColorsCategoryLabel Define la etiqueta del categoría colores estándar.
Solo es válido cuando ColorTemplate tiene un valor de ThemeColors. Esta es la única plantilla que contiene categorías etiquetadas.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_StandardColorsTooltips Define una matriz de cadenas de información sobre herramientas de muestra de color para la cuadrícula de StandardColors.
Cada selector de color Drop-Down ColorTemplate contiene una cuadrícula de StandardColors.
Nota: Solo se usan las sugerencias de herramientas necesarias para etiquetar las muestras de color mostradas en la cuadrícula de StandardColors. Si se proporcionan menos etiquetas que el número de muestras en la cuadrícula de StandardColors, se proporciona un valor predeterminado para las muestras que permanecen.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_ThemeColors Define una matriz de valores COLORREF para las muestras de un selector de color de Drop-Down.
Solo es válido cuando ColorTemplate tiene un valor de ThemeColors.
Nota: Se muestran los valores COLORREF del ThemeColorGridRows inicial x Columnas de la matriz. Si la matriz define menos colores que el número de muestras de ThemeColors declaradas en marcado, se muestran espacios vacíos para los chips que faltan.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_ThemeColorsTooltips Define la matriz de cadenas de información sobre herramientas de muestra de color para la cuadrícula de ThemeColors.
Solo es válido cuando ColorTemplate tiene un valor de ThemeColors.
Nota: Solo se usan las sugerencias de herramientas necesarias para etiquetar las muestras de color mostradas en la cuadrícula de ThemeColors. Si se proporcionan menos etiquetas que el número de muestras en la cuadrícula de ThemeColors, se proporciona un valor predeterminado para las muestras que permanecen.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_ThemeColorsCategoryLabel Define la etiqueta para la categoría colores del tema.
Solo es válido cuando ColorTemplate tiene un valor de ThemeColors. Esta es la única plantilla que contiene categorías etiquetadas.
Admite IUIFramework::GetUICommandProperty y IUIFramework::SetUICommandProperty.
UI_PKEY_TooltipDescription Define la cadena de caracteres de una descripción de información sobre herramientas asociada a un UI_PKEY_TooltipTitle.
Solo se puede actualizar a través de la invalidación.
UI_PKEY_TooltipTitle Define la cadena de caracteres para una información sobre herramientas de comando.
Solo se puede actualizar a través de la invalidación.

Controladores de comandos

El método IUICommandHandler::UpdateProperty se usa para personalizar un selector de color Drop-Down a través de las claves de propiedad enumeradas anteriormente. En el ejemplo siguiente se muestra cómo establecer las muestras de color de un selector de color de Drop-Down, en función de una preferencia de estilo personalizada o una cuadrícula de muestra personalizada declarada en marcado.

STDMETHODIMP DropDownColorPickerHandler::UpdateProperty(
              UINT nCmdID,
              __in REFPROPERTYKEY key,
              __in_opt const PROPVARIANT* ppropvarCurrentValue,
              __out PROPVARIANT* ppropvarNewValue)
{
  HRESULT hr = E_NOTIMPL;
  if (key == UI_PKEY_ThemeColors)
  {
    COLORREF rThemeColors[TOT_THEME_COLORS];
    for (LONG i = 0; i < ARRAYSIZE(rThemeColors); i++)
    {
      // any COLORREF
      rThemeColors[i] = RGB(0, 255, 0); 
    }
    hr = InitPropVariantFromUInt32Vector(
           &rThemeColors, ARRAYSIZE(rThemeColors), ppropvarNewValue);
  }

  else if (key == UI_PKEY_StandardColors)
  {
    ULONG rStandardColors[TOT_STANDARD_COLORS];
    for (LONG i = 0; i < ARRAYSIZE(rStandardColors); i++)
    {
      // any COLORREF
      rStandardColors[i] = RGB(255, 0, 0); 
    }
    hr = InitPropVariantFromUInt32Vector(
           &rStandardColors, ARRAYSIZE(rStandardColors),ppropvarNewValue);
  }

  else if (key == UI_PKEY_ThemeColorsTooltips)
  {
    BSTR rThemeTooltips[TOT_THEME_COLORS];
    for (LONG i = 0; i < ARRAYSIZE(rThemeTooltips); i++)
    {
      // any constant character string
      rThemeTooltips[i] = L"Green"; 
    }
    hr = InitPropVariantFromStringVector((PCWSTR *)&rThemeTooltips, 50, ppropvarNewValue);
  }
  else if (key == UI_PKEY_StandardColorsTooltips)
  {
    static BSTR rStandardTooltips[TOT_STANDARD_COLORS];
    for (LONG i = 0; i < ARRAYSize(rStandardTooltips); i++)
    {
      // any constant character string
      rStandardTooltips[i] = L"Red"; 
    }
    hr = InitPropVariantFromStringVector(
           (PCWSTR *)&rStandardTooltips, 20, ppropvarNewValue);
  }
  return hr;
}

En el ejemplo siguiente se muestra una implementación del método IUICommandHandler::Execute que expone los colores de muestra del selector de colores de Drop-Down a la aplicación Ribbon.

STDMETHODIMP DropDownColorPickerHandler::Execute(
                 UINT nCmdID,
                 UI_EXECUTIONVERB verb,
                 __in_opt const PROPERTYKEY* key,
                 __in_opt const PROPVARIANT* ppropvarValue,
                 __in_opt IUISimplePropertySet* pCommandExecutionProperties)
{
  HRESULT hr = E_NOTIMPL;
  if (*key == UI_PKEY_ColorType)
  {
    UI_SWATCHCOLORTYPE uType = 
      (UI_SWATCHCOLORTYPE)PropVariantToUInt32WithDefault(
        *ppropvarValue, 
        UI_SWATCHCOLORTYPE_NOCOLOR);

    COLORREF color;
    switch(uType)
    {
      case UI_SWATCHCOLORTYPE_RGB:
        PROPVARIANT var;
        pCommandExecutionProperties->GetValue(UI_PKEY_Color, &var);
        color = PropVariantToUInt32WithDefault(var, 0);
        break;
      case UI_SWATCHCOLORTYPE_AUTOMATIC:
        color = COLOR_WINDOWTEXT;
        break;
      case UI_SWATCHCOLORTYPE_NOCOLOR:
        color = MSONoFill;
        break;
    }

    // do with your color what you will...
    gInternalColor = color;
    hr = S_OK;
  }
  return hr;
}

biblioteca de controles de Windows Ribbon Framework

elemento de marcado DropDownColorPicker

propiedades del selector de colores de

personalizar una cinta de opciones mediante definiciones de tamaño y directivas de escalado

de ejemplo DropDownColorPicker