WPF InkCanvas — сохраненное изображение черного цвета

В данный момент я изучаю WPF и С#, для этого я пытаюсь реализовать небольшое приложение для рисования. Для этого я использую InkCanvas и хочу сохранить его как изображение .jpg или .png.

Я получил код для сохранения InkCanvas отсюда: Преобразовать WPF InkCanvas в Bitmap Но вместо того, чтобы преобразовать его в байтовый массив, я пытаюсь сохранить его напрямую, используя SaveFileDialog.

Результат после сохранения холста: размер в порядке, он такой же, как и размер холста. Но сейв .jpg полностью черный и не знаю почему.

Я искал проблему и наткнулся на это: Stackoverflow - InkCanvas to BitMap. Поэтому я попытался поместить свой InkCanvas в несколько контейнеров без какого-либо другого содержимого, но ничего не меняется, сохраненное изображение остается черным. Вторая ссылка, которую я нашел, это: Stackoverflow - сохранение WPF InkCanvas в JPG - изображение обрезается В моем проекте нет текстового поля, поэтому я попытался удалить другие элементы управления, но с тем же результатом. Сохраненное изображение остается черным.

Я даже пытался использовать разные пиксельные форматы, сохраняя их без полей и т. Д. Я что-то упускаю?

XAML-код:

   <Grid>
    <DockPanel>
        <Menu DockPanel.Dock="Top" Height="30" Background="#252629" FontSize="18" Foreground="#dddddd" Panel.ZIndex="999">
            <MenuItem Header="_File">
                <MenuItem x:Name="mnuItmNew" Header="_New Image" Background="#252629" Click="mnuNewImage_Click"/>
                <MenuItem x:Name="mnuItmOpen" Header="_Open Image" Background="#252629"/>
                <MenuItem x:Name="mnuItmSave" Header="_Save" Background="#252629" IsEnabled="False"/>
                <MenuItem x:Name="mnuItmSaveAs" Header="_Save as" Background="#252629" IsEnabled="False"/>
                <MenuItem x:Name="mnuItmExport" Header="_Export" Background="#252629" IsEnabled="False" Click="mnuExport_Click"/>
                <MenuItem x:Name="mnuItmExit" Header="_Exit" Background="#252629" Click="mnuExit_Click"/>
            </MenuItem>
            <MenuItem Header="_Edit">
                <MenuItem Header="_Resize Canvas" Background="#252629"/>
                <MenuItem Header="_Settings" Background="#252629"/>
            </MenuItem>
            <MenuItem Header="_?">
                <MenuItem Header="_Help" Background="#252629"/>
                <MenuItem Header="_About" Click="mnuAbout_Click" Background="#252629"/>
            </MenuItem>
        </Menu>
        <StackPanel DockPanel.Dock="Top" Height="30" Orientation="Horizontal" Background="#252629" Panel.ZIndex="999">

        </StackPanel>
        <StackPanel DockPanel.Dock="Bottom" Height="20" Orientation="Horizontal" Background="#353639" Panel.ZIndex="999">

        </StackPanel>
        <StackPanel DockPanel.Dock="Right" Width="300" Orientation="Vertical" Margin="0,1,0,1" Background="#252629" Panel.ZIndex="999">

        </StackPanel>
        <StackPanel DockPanel.Dock="Right" Width="50" Orientation="Vertical" Margin="0,1,1,1" Background="#252629" Panel.ZIndex="999">
            <Button x:Name="btnHand" Width="50" Height="50" Background="#252629" BorderThickness="0" Content="Hand" Click="btnHand_Click"/>
            <Button x:Name="btnPen" Width="50" Height="50" Background="#252629" BorderThickness="0" Content="Pen" Click="btnPen_Click"/>
            <Button x:Name="btnErase" Width="50" Height="50" Background="#252629" BorderThickness="0" Content="Erase" Click="btnErase_Click"/>
            <Button x:Name="btnFill" Width="50" Height="50" Background="#252629" BorderThickness="0" Content="Fill" Click="btnFill_Click"/>
            <Button x:Name="btnColPick" Width="50" Height="50" Background="#252629" BorderThickness="0" Content="Pick" Click="btnColPick_Click"/>
        </StackPanel>
        <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
            <Grid>
                <Grid x:Name="drawPanel">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="50"/>
                        <ColumnDefinition Width="1*"/>
                        <ColumnDefinition Width="50"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="50"/>
                        <RowDefinition Height="1*"/>
                        <RowDefinition Height="50"/>
                    </Grid.RowDefinitions>
                    <Canvas DockPanel.Dock="Top" Background="#151619" Height="50" Grid.ColumnSpan="3"/>
                    <Canvas DockPanel.Dock="Bottom" Background="#151619" Height="50" Grid.ColumnSpan="3"/>
                    <Canvas DockPanel.Dock="Left" Background="#151619" Width="50" Grid.RowSpan="3"/>
                    <Canvas DockPanel.Dock="Right" Background="#151619" Width="50" Grid.RowSpan="3"/>
                    <Canvas x:Name="canvasDrawBackground" Grid.Column="1" Grid.Row="1" Height="0" Width="0" IsEnabled="False">
                        <Canvas.Background>
                            <VisualBrush TileMode="Tile" ViewportUnits="Absolute" Viewport="0,0,20,20">
                                <VisualBrush.Visual>
                                    <Image Source="images/drawBoardTile.png"></Image>
                                </VisualBrush.Visual>
                            </VisualBrush>
                        </Canvas.Background>
                    </Canvas>
                    <InkCanvas x:Name="canvasDraw" Background="Transparent" Height="0" Width="0" Grid.Row="1" Grid.Column="1" IsEnabled="False" EditingModeInverted="EraseByPoint"/>
                </Grid>
            </Grid>
        </ScrollViewer>
    </DockPanel>
</Grid>

C#-Code for saving

        private void mnuExport_Click(object sender, RoutedEventArgs e)
    {
        Microsoft.Win32.SaveFileDialog dlgSave = new Microsoft.Win32.SaveFileDialog();
        dlgSave.FileName = "unnamed"; // Default file name
        dlgSave.DefaultExt = ".jpg"; // Default file extension
        dlgSave.Filter = "Image (.jpg)|*.jpg"; // Filter files by extension

        // Show save file dialog box
        Nullable<bool> result = dlgSave.ShowDialog();

        // Process save file dialog box results
        if (result == true)
        {
            // Save document
            string filename = dlgSave.FileName;
            //get the dimensions of the ink control
            int margin = (int)this.canvasDraw.Margin.Left;
            int width = (int)this.canvasDraw.ActualWidth - margin;
            int height = (int)this.canvasDraw.ActualHeight - margin;
            //render ink to bitmap
            RenderTargetBitmap rtb = new RenderTargetBitmap(width, height, 96d, 96d, PixelFormats.Default);
            rtb.Render(canvasDraw);

            //saving bitmap
            using (FileStream savestream = new FileStream(filename, FileMode.Create))
            {
                BmpBitmapEncoder encoder = new BmpBitmapEncoder();
                encoder.Frames.Add(BitmapFrame.Create(rtb));
                encoder.Save(savestream);
            }
        }
    }

Спасибо за вашу помощь!


person Hoargarth    schedule 12.05.2017    source источник
comment
JPEG не поддерживает прозрачность. Прозрачный цвет будет черным. Вместо этого попробуйте png. (или сделать фон белым)   -  person Jeroen van Langen    schedule 12.05.2017
comment
Да, я знаю об этом, во втором окне фон установлен белый (размер InkCanvas тоже), извините, я забыл упомянуть об этом. Но я уже пробовал как png и все равно все черное.   -  person Hoargarth    schedule 12.05.2017