Tutorial: Actualizar un gráfico en una hoja de cálculo utilizando botones de radio

En este tutorial se muestran los conceptos básicos del uso de botones de radio en una hoja de cálculo de Microsoft Office Excel para dar al usuario una manera de cambiar rápidamente entre opciones. En este caso, las opciones cambian el estilo de un gráfico.

Se aplica a: la información de este tema se aplica a proyectos de nivel de documento para Excel. Para obtener más información, consulte Características disponibles por aplicación de Office lication y tipo de proyecto.

Para ver el resultado como ejemplo completado, vea el ejemplo de controles de Excel en ejemplos de desarrollo de Office y tutoriales.

En este tutorial se muestran las tareas siguientes:

  • Agregar un grupo de botones de radio a una hoja de cálculo.

  • Cambiar el estilo del gráfico cuando se selecciona una opción.

Nota:

Es posible que tu equipo muestre nombres o ubicaciones diferentes para algunos de los elementos de la interfaz de usuario de Visual Studio en las siguientes instrucciones. La edición de Visual Studio que se tenga y la configuración que se utilice determinan estos elementos. Para más información, vea Personalizar el IDE de Visual Studio.

Requisitos previos

Necesitará los componentes siguientes para completar este tutorial:

Agregar un gráfico a una hoja de cálculo

Puede crear un proyecto de libro de Excel que personalice un libro existente. En este tutorial, agregará un gráfico a un libro y, a continuación, usará este libro en una nueva solución de Excel. El origen de datos de este tutorial es una hoja de cálculo denominada Data for Chart.

Para agregar los datos

  1. Abra Microsoft Excel.

  2. Haga clic con el botón derecho en la pestaña Sheet3 y, a continuación, haga clic en Cambiar nombre en el menú contextual.

  3. Cambie el nombre de la hoja a Datos del gráfico.

  4. Agregue los siguientes datos a Datos del gráfico con la celda A4 que es la esquina superior izquierda y E8 la esquina inferior derecha.

    Región/Trimestre T1 T2 T3 T4
    West 500 550 550 600
    East 600 625 675 700
    North 450 470 490 510
    South 800 750 775 790

    A continuación, agregue un gráfico a la primera hoja de cálculo para mostrar los datos.

Para agregar un gráfico en Excel

  1. En la pestaña Insertar , en el grupo Gráficos , haga clic en Columnay, a continuación, haga clic en Todos los tipos de gráficos.

  2. En el cuadro de diálogo Insertar gráfico , haga clic en Aceptar.

  3. En la pestaña Diseño , en el grupo Datos , haga clic en Seleccionar datos.

  4. En el cuadro de diálogo Seleccionar origen de datos , haga clic en el cuadro Rango Chartdata y desactive cualquier selección predeterminada.

  5. En la hoja Datos para gráficos , seleccione el bloque de celdas que contiene los números, que incluye A4 en la esquina superior izquierda a E8 en la esquina inferior derecha.

  6. En el cuadro de diálogo Seleccionar origen de datos , haga clic en Aceptar.

  7. Cambie la posición del gráfico para que la esquina superior derecha se alinee con la celda E2.

  8. Guarde el archivo en la unidad C y asígnele el nombre ExcelChart.xlsx.

  9. Salga de Excel.

Creación de un nuevo proyecto

En este paso, creará un proyecto de libro de Excel basado en el libro excelChart .

Para crear un nuevo proyecto

  1. Cree un proyecto de libro de Excel con el nombre Mi gráfico de Excel. En el asistente, seleccione Copiar un documento existente.

    Para obtener más información, vea Cómo: Crear proyectos de Office en Visual Studio.

  2. Haga clic en el botón Examinar y vaya al libro que creó anteriormente en este tutorial.

  3. Haga clic en OK.

    Visual Studio abre el nuevo libro de Excel en el diseñador y agrega el proyecto Mi gráfico de Excel a Explorador de soluciones.

Establecer propiedades del gráfico

Al crear un nuevo proyecto de libro de Excel que usa un libro existente, los controles host se crean automáticamente para todos los rangos con nombre, los objetos de lista y los gráficos del libro. Puede cambiar el nombre del Chart control mediante la ventana Propiedades .

Para cambiar el nombre del control Chart

  1. Seleccione el Chart control en el diseñador y cambie las siguientes propiedades en la ventana Propiedades .

    Propiedad Valor
    Nombre dataChart
    HasLegend false

Agregar controles

Esta hoja de cálculo usa botones de radio para dar a los usuarios una manera de cambiar rápidamente el estilo del gráfico. Sin embargo, los botones de radio deben ser exclusivos, cuando se selecciona un botón, no se puede seleccionar ningún otro botón del grupo al mismo tiempo. Este comportamiento no sucede de forma predeterminada cuando se agregan varios botones de radio a una hoja de cálculo.

Una manera de agregar este comportamiento es agrupar los botones de radio en un control de usuario, escribir el código detrás del control de usuario y, a continuación, agregar el control de usuario a la hoja de cálculo.

Para agregar un control de usuario

  1. Seleccione el proyecto Mi gráfico de Excel en Explorador de soluciones.

  2. En el menú Proyecto , haga clic en Agregar nuevo elemento.

  3. En el cuadro de diálogo Agregar nuevo elemento , haga clic en Control de usuario, asigne al control el nombre ChartOptions y haga clic en Agregar.

Para agregar botones de radio al control de usuario

  1. Si el control de usuario no está visible en el diseñador, haga doble clic en ChartOptions en Explorador de soluciones.

  2. En la pestaña Controles comunes del Cuadro de herramientas, arrastre un control Botón de radio al control de usuario y cambie las siguientes propiedades.

    Propiedad Valor
    Nombre columnChart
    Texto Gráfico de columnas
  3. Agregue un segundo botón de radio al control de usuario y cambie las siguientes propiedades.

    Propiedad Valor
    Nombre barChart
    Texto Gráfico de barras
  4. Agregue un tercer botón de radio al control de usuario y cambie las siguientes propiedades.

    Propiedad Valor
    Nombre lineChart
    Texto Gráfico de líneas
  5. Agregue un cuarto botón de radio al control de usuario y cambie las siguientes propiedades.

    Propiedad Valor
    Nombre areaBlockChart
    Texto Gráfico de bloques de área

    A continuación, escriba el código para actualizar el gráfico cuando se haga clic en un botón de radio.

Cambiar el estilo del gráfico cuando se selecciona un botón de radio

Ahora puede agregar el código para cambiar el estilo del gráfico. Para ello, cree un evento público en el control de usuario, agregue una propiedad para establecer el tipo de selección y cree un controlador de eventos para el CheckedChanged evento de cada uno de los botones de radio.

Para crear un evento y una propiedad en un control de usuario

  1. En Explorador de soluciones, haga clic con el botón derecho en el control de usuario y, a continuación, haga clic en Ver código.

  2. Agregue código a la ChartOptions clase para crear un SelectionChanged evento y la Selection propiedad .

    public event EventHandler SelectionChanged;
    
    private Microsoft.Office.Interop.Excel.XlChartType selectedType =
        Microsoft.Office.Interop.Excel.XlChartType.xlColumnClustered;
    
    public Microsoft.Office.Interop.Excel.XlChartType Selection
    {
        get
        {
            return this.selectedType;
        }
        set
        {
            this.selectedType = value;
        }
    }
    

Para controlar el evento CheckedChanged de los botones de radio

  1. Establezca el tipo de gráfico en el controlador de eventos CheckedChanged del botón de radio areaBlockChart y, a continuación, genere el evento.

    private void areaBlockChart_CheckedChanged(object sender, EventArgs e)
    {
        if (((RadioButton)sender).Checked)
        {
            this.selectedType = Microsoft.Office.Interop.Excel.XlChartType.xlAreaStacked;
            if (this.SelectionChanged != null)
            {
                this.SelectionChanged(this, EventArgs.Empty);
            }
        }
    }
    
  2. Establezca el tipo de gráfico en el controlador de eventos CheckedChanged del botón de radio barChart.

    private void barChart_CheckedChanged(object sender, EventArgs e)
    {
        if (((RadioButton)sender).Checked)
        {
            this.selectedType = Microsoft.Office.Interop.Excel.XlChartType.xlBarClustered;
            if (this.SelectionChanged != null)
            {
                this.SelectionChanged(this, EventArgs.Empty);
            }
        }
    }
    
  3. Establezca el tipo de gráfico en el controlador de eventos CheckedChanged del botón de radio columnChart.

    private void columnChart_CheckedChanged(object sender, EventArgs e)
    {
        if (((RadioButton)sender).Checked)
        {
            this.selectedType = Microsoft.Office.Interop.Excel.XlChartType.xlColumnClustered;
            if (this.SelectionChanged != null)
            {
                this.SelectionChanged(this, EventArgs.Empty);
            }
        }
    }
    
  4. Establezca el tipo de gráfico en el controlador de eventos CheckedChanged del botón de radio lineChart.

    private void lineChart_CheckedChanged(object sender, EventArgs e)
    {
        if (((RadioButton)sender).Checked)
        {
            this.selectedType = Microsoft.Office.Interop.Excel.XlChartType.xlLineMarkers;
            if (this.SelectionChanged != null)
            {
                this.SelectionChanged(this, EventArgs.Empty);
            }
        }
    }
    
  5. En C#, debe agregar controladores de eventos para los botones de radio. Puede agregar el código al constructor ChartOptions, debajo de la llamada a InitializeComponent. Para obtener información sobre cómo crear controladores de eventos, vea How to: Create event handlers in Office projects.

    public ChartOptions()
    {
        InitializeComponent();
    
        areaBlockChart.CheckedChanged += new EventHandler(areaBlockChart_CheckedChanged);
        barChart.CheckedChanged += new EventHandler(barChart_CheckedChanged);
        columnChart.CheckedChanged += new EventHandler(columnChart_CheckedChanged);
        lineChart.CheckedChanged += new EventHandler(lineChart_CheckedChanged);
    }
    

Adición del control de usuario a la hoja de cálculo

Al compilar la solución, el nuevo control de usuario se agrega automáticamente al Cuadro de herramientas. A continuación, puede arrastrar el control desde el Cuadro de herramientas a la hoja de cálculo.

Para agregar el control de usuario de la hoja de cálculo

  1. En el menú Compilar , haga clic en Compilar solución.

    El control de usuario ChartOptions se agrega al Cuadro de herramientas.

  2. En Explorador de soluciones, haga clic con el botón derecho en Sheet1.vb o Sheet1.cs y, a continuación, haga clic en Diseñador de vistas.

  3. Arrastre el control ChartOptions desde el cuadro de herramientas a la hoja de cálculo.

    Se agrega un nuevo control denominado my_Excel_Chart_ChartOptions1 al proyecto.

  4. Cambie el nombre del control a ChartOptions1.

Cambiar el tipo de gráfico

Para cambiar el tipo de gráfico, cree un controlador de eventos que establezca el estilo según la opción seleccionada en el control de usuario.

Para cambiar el tipo de gráfico que se muestra en la hoja de cálculo

  1. Agrega el siguiente controlador de eventos a la clase Sheet1.

    private void ChartOptions1_SelectionChanged(object sender, EventArgs e)
    {
        try
        {
            dataChart.ChartType = this.ChartOptions1.Selection;
        }
        catch (Exception ex)
        {
            MessageBox.Show(ex.ToString());
        }
    }
    
  2. En C#, debe agregar un controlador de eventos para el control de usuario al Startup evento, como se muestra a continuación. Para obtener información sobre cómo crear controladores de eventos, vea How to: Create event handlers in Office projects.

    this.ChartOptions1.SelectionChanged += new EventHandler(ChartOptions1_SelectionChanged);
    

Prueba de la aplicación

Ahora puede probar el libro para comprobar que el gráfico tiene un estilo correcto al seleccionar un botón de radio.

Para probar el libro

  1. Presione F5 para ejecutar el proyecto.

  2. Seleccione varios botones de radio.

  3. Confirme que el estilo del gráfico cambia para coincidir con la selección.

Pasos siguientes

En este tutorial se muestran los conceptos básicos del uso de botones de radio y estilos de gráfico en hojas de cálculo. A continuación, podría realizar las siguientes tareas: