FlexSheet for WPF | ComponentOne
Customizing Appearance / Using Floating Objects / Inserting Images
In This Topic
    Inserting Images
    In This Topic

    Images can be easily inserted and formatted in C1FlexSheet. Follow the given steps in XAML to add a sheet and insert images in it:

    1. Copy the following code inside Grid tag to add C1FlexSheet control and a button control:
      XAML
      Copy Code
          <Grid.RowDefinitions>
              <RowDefinition Height="Auto"/>
              <RowDefinition/>
      </Grid.RowDefinitions>
          <c1:C1FlexSheet Name="flex" Grid.Row="1" HorizontalAlignment="Left" VerticalAlignment="Top"/>
          <Button Content="Insert Picture" Name="btnInsertPicture" Click="btnInsertPicture_Click" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75"/>
      

    2. Right-click Design view and select View Code from the context menu.
    3. Insert the following code directly below the InitializeComponent() method to add a sheet:
      'adding Sheet
      flex.AddSheet("Sheet1", 50, 10)
      
      //adding Sheet
      flex.AddSheet("Sheet1", 50, 10);
      

    4. Go back to the Design view and select Event handlers of btnInsertPicture from the Properties windows.
    5. Double-click the btnInsertPicture_Click event handler.
      The Code view will open again.
    6. Add the following code to the btnInsertPicture_Click event handler to insert an image on button click:
      Dim dlg = New Microsoft.Win32.OpenFileDialog()
      dlg.Filter = "Image files (*.png;*.jpeg;*.jpg;*.bmp)|*.png;*.jpeg;*.jpg;*.bmp|All files (*.*)|*.*"
      If dlg.ShowDialog().Value Then
          Try
              Dim b As New BitmapImage()
              b.BeginInit()
              b.UriSource = New Uri(dlg.FileName)
              b.EndInit()
              flex.InsertImage(b)
          Catch x As Exception
              Dim msg = "Error opening file: " & vbCr & vbLf & vbCr & vbLf + x.Message
              MessageBox.Show(msg, "Error", MessageBoxButton.OK)
          End Try
      End If
      
      var dlg = new Microsoft.Win32.OpenFileDialog();
      dlg.Filter = "Image files (*.png;*.jpeg;*.jpg;*.bmp)|*.png;*.jpeg;*.jpg;*.bmp|All files (*.*)|*.*";
      if (dlg.ShowDialog().Value)
      {
          try
          {
              BitmapImage b = new BitmapImage();
              b.BeginInit();
              b.UriSource = new Uri(dlg.FileName);
              b.EndInit();
              flex.InsertImage(b);
          }
          catch (Exception x)
          {
              var msg = "Error opening file: \r\n\r\n" + x.Message;
              MessageBox.Show(msg, "Error", MessageBoxButton.OK);
          }
      }
      
    7. Run the application.
    8. Click Insert Picture button.
      The Open dialog box appears.
    9. Locate and select an image, and click Open button to open the selected image as shown in the image below:

      Selecting Image

    10. The image appears on the FlexSheet control:

      Image