ReSQL.ru
     
powered by simpleCommunicator - 2.0.49     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / WPF, Silverlight [игнор отключен] [закрыт для гостей] / Нарисовать строку на изображении в image
8 сообщений из 8, страница 1 из 1
Нарисовать строку на изображении в image
    #39467161
Фотография mraklbrw
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mraklbrw
Участник
Добрый день.
Недавно начал изучать WPF(перешёл с WinForms), возникла надобность нанести строку из TextBox на изображение, загруженное в Image и поместить получившееся изображение в image2.

 
Код
Код: c#
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace Watermark_Guru
{
    /// <summary>
    /// Логика взаимодействия для MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        BitmapImage bm1;

        public MainWindow()
        {
            InitializeComponent();
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            //bm1 = new BitmapImage();
        }

        // Кнопка - открыть файл
        private void btn1_Click(object sender, RoutedEventArgs e)
        {
            try
            {
                string path = "";
                Microsoft.Win32.OpenFileDialog dlg = new Microsoft.Win32.OpenFileDialog();
                Nullable<bool> result = dlg.ShowDialog();
                if (result == true) path = dlg.FileName; // Получение пути выбранного в диалоге файла

                bm1 = new BitmapImage();
                bm1.BeginInit();
                bm1.UriSource = new Uri(path, UriKind.Relative);
                bm1.CacheOption = BitmapCacheOption.OnLoad;
                bm1.EndInit();

                im1.Source = bm1;
            }
            catch (Exception)
            {
                MessageBox.Show("Path doesn't exists.");
            }
        }

        // Кнопка - сгенерировать 2-ое изображение
        private void btn3_Click(object sender, RoutedEventArgs e)
        {
            string watermark_text = tb1.Text;

            DrawingVisual dv = new DrawingVisual();
            DrawingContext dc = dv.RenderOpen();
            dc.DrawLine(new Pen(Brushes.Black, 1.0), new Point(40, 40), new Point(200, 200));
            dc.Close();

            RenderTargetBitmap bm2 = new RenderTargetBitmap(400, 300, 126, 126, PixelFormats.Pbgra32);

            
            bm2.Render(dv);

            im2.Source = bm2;

        }
    }
}




У меня выходит просто нарисованная линия, т.к. содержимое из image не знаю, как скопировать в image2 или в новый bitmap и уже на нём что-нибудь нарисовать.
...
Рейтинг: 0 / 0
06.06.2017, 18:11
| Ответить | Цитировать | Написать  
Нарисовать строку на изображении в image
    #39468101
iMrTidy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
iMrTidy
Участник
mraklbrw,

Все что связано с оформлением (за редким исключением) следует писать в XAML. Для Вашего случая можно поступить так:

Код: xml
1.
2.
3.
4.
    <Grid>
        <Image Source="...путь к изображению..." />
        <TextBox Background="70FFFFFF" HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" FontSize="50" Text="Test" />
    </Grid>
...
Рейтинг: 0 / 0
07.06.2017, 18:12
| Ответить | Цитировать | Написать  
Нарисовать строку на изображении в image
    #39469084
Фотография mraklbrw
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mraklbrw
Участник
iMrTidy,

а как сохранить изображение вместе с надписью в textbox-е в новый файл(например, 2.bmp) ?
...
Рейтинг: 0 / 0
08.06.2017, 22:16
| Ответить | Цитировать | Написать  
Нарисовать строку на изображении в image
    #39469104
iMrTidy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
iMrTidy
Участник
mraklbrwiMrTidy,

а как сохранить изображение вместе с надписью в textbox-е в новый файл(например, 2.bmp) ?

Довльно редко требуются такие вещи. А для чего?
Как правило есть возможно сделать задачу проще.

XAML:
 
Код: xml
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
<Window x:Class="WpfApp2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp2"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525" ContentRendered="Window_ContentRendered">
    <Grid Name="myGrid">
        <Image MaxWidth="300" Source="D:\Test\Capture.jpg" />
        <TextBox BorderBrush="Transparent" Background="Transparent" HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" FontSize="50" Text="Test" />
    </Grid>
</Window>



C#:
 
Код: c#
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
        public MainWindow()
        {
            InitializeComponent();
        }

        public void RenderTargetBitmapExample()
        {
            var size = new Size(myGrid.ActualWidth, myGrid.ActualHeight); //Size object will be used to define Bitmap.
            var bmp = new RenderTargetBitmap((int)size.Width, (int)size.Height, 96, 96, PixelFormats.Pbgra32); //Bitmap for rendering from visual object.

            var drawingvisual = new DrawingVisual();
            using (DrawingContext context = drawingvisual.RenderOpen())
            {
                context.DrawRectangle(new VisualBrush(myGrid), null, new Rect(new Point(), size)); //Here we decide what visual object and its size.
                context.Close();
            }
            bmp.Render(drawingvisual);

            var encoder = new PngBitmapEncoder();
            encoder.Frames.Add(BitmapFrame.Create(bmp));
            var fs = new FileStream(@"d:\test\test.png", FileMode.Create);
            encoder.Save(fs);
        }

        private void Window_ContentRendered(object sender, EventArgs e)
        {
            RenderTargetBitmapExample();
        }
    }

...
Рейтинг: 0 / 0
09.06.2017, 00:07
| Ответить | Цитировать | Написать  
Нарисовать строку на изображении в image
    #39469184
iMrTidy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
iMrTidy
Участник
mraklbrw,

Сохранять в файл Вам возможно и не требуется, это лишь для примера.
...
Рейтинг: 0 / 0
09.06.2017, 09:56
| Ответить | Цитировать | Написать  
Нарисовать строку на изображении в image
    #39469376
Фотография mraklbrw
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mraklbrw
Участник
iMrTidy,

Спасибо за пример, но возник ещё такой вопрос:
почему при изменении текста в textbox вручную пользователем при сохранении он сохраняет картинку с этим текстом, а при изменении текста в TextBox программно изменения не происходят(сохраняется картинка с надписью Test).

 
Сохранение изображения
Код: c#
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
// Кнопка - изменить текст
        private void btn3_Click(object sender, RoutedEventArgs e)
        {
            TB_2.Text= tb1.Text; // TB2 - это textBox с надписью Test, а tb1 - это там, где пользователь что-то пишет

            Thread.Sleep(250);

            RenderTargetBitmapExample();

        }

        public void RenderTargetBitmapExample()
        {
            var size = new Size(myGrid.ActualWidth, myGrid.ActualHeight); //Size object will be used to define Bitmap.
            var bmp = new RenderTargetBitmap((int)size.Width, (int)size.Height, 96, 96, PixelFormats.Pbgra32); //Bitmap for rendering from visual object.

            var drawingvisual = new DrawingVisual();
            using (DrawingContext context = drawingvisual.RenderOpen())
            {
                context.DrawRectangle(new VisualBrush(myGrid), null, new Rect(new Point(), size)); //Here we decide what visual object and its size.
                context.Close();
            }
            bmp.Render(drawingvisual);

            var encoder = new PngBitmapEncoder();
            encoder.Frames.Add(BitmapFrame.Create(bmp));
            var fs = new FileStream(@"test.png", FileMode.Create);
            encoder.Save(fs);
        }



Возможно это происходит из-за того, что мы в XAML жёстко задали текст - Test и нужно как-то по другому его перезаписать?
...
Рейтинг: 0 / 0
09.06.2017, 12:31
| Ответить | Цитировать | Написать  
Нарисовать строку на изображении в image
    #39469467
iMrTidy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
iMrTidy
Участник
mraklbrw,

В WPF код "позади" окна/контрола не приветствуется, т.к. это нарушет принципы MVVM. Очень рекомендую почитать литературу на тему WPF/MVVM.

Картинка не меняется программно, т.к. XAML часть не успевает ее перерисовать, это можно решить добавив .UpdateLayout(); сразу после присвоения нового значения, но я не рекомендую это.

Я не зря спросил про цель. Возможно Вам вообще не нужно ничего делать в XAML, а написать все кодом. Но раз уж Вы упомянули, что есть пользователь, то лучше сделать так:

XAML:
 
Код: xml
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
<Window x:Class="VisualElementToBitmap.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:VisualElementToBitmap"
        mc:Ignorable="d"
        Title="MainWindow" Height="500" Width="525">
    <StackPanel>
        <Grid Name="myGrid">
            <Image Source="Resources\Capture.JPG" />
            <Label Name="myLabel" BorderBrush="Transparent" Background="Transparent" HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" FontSize="50"
                   Content="{Binding ElementName=txt, Path=Text}" />
        </Grid>
        <StackPanel>
            <Label Content="User text:" />
            <TextBox Name="txt" Text="User Test" Margin="5,5,0,0" />
            <Button Width="Auto" HorizontalAlignment="Left" Margin="5,5,0,0" Content="Generate image" Click="Button_Click" />
        </StackPanel>
    </StackPanel>
</Window>



C#:
 
Код: c#
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        public void RenderTargetBitmapExample()
        {
            var size = new Size(myGrid.ActualWidth, myGrid.ActualHeight); //Size object will be used to define Bitmap.
            var bmp = new RenderTargetBitmap((int)size.Width, (int)size.Height, 96, 96, PixelFormats.Pbgra32); //Bitmap for rendering from visual object.

            var drawingvisual = new DrawingVisual();
            using (DrawingContext context = drawingvisual.RenderOpen())
            {
                context.DrawRectangle(new VisualBrush(myGrid), null, new Rect(new Point(), size)); //Here we decide what visual object and its size.
                context.Close();
            }
            bmp.Render(drawingvisual);

            var encoder = new PngBitmapEncoder();
            encoder.Frames.Add(BitmapFrame.Create(bmp));
            var fs = new FileStream(@"c:\test\test.png", FileMode.Create);
            encoder.Save(fs);
            fs.Close();
            fs.Dispose();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            RenderTargetBitmapExample();
        }
    }

...
Рейтинг: 0 / 0
09.06.2017, 13:36
| Ответить | Цитировать | Написать  
Нарисовать строку на изображении в image
    #39469819
Фотография mraklbrw
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mraklbrw
Участник
iMrTidy,

Благодарю Вас. Вы мне очень помогли.
...
Рейтинг: 0 / 0
09.06.2017, 22:06
| Ответить | Цитировать | Написать  
8 сообщений из 8, страница 1 из 1
Форумы / WPF, Silverlight [игнор отключен] [закрыт для гостей] / Нарисовать строку на изображении в image
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение
NoSQL.ru       Новости, Чат       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=21&msg=39469467&tid=1440528]:
 0ms
get settings:
 9ms
get forum list:
 13ms
check forum access:
 4ms
check topic access:
 4ms
track hit:
 171ms
get topic data:
 10ms
get forum data:
 3ms
get page messages:
 42ms
get tp. blocked users:
 1ms
others: 233ms
total:  490ms
созд. / загр.: 490ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]