We Keep Coding

WPF choosing an image via file dialog and interpolating it to a certain size

I'm trying to load up an image of my choosing in a WPF window and then change it's width and height. All I've come up with was:
public void OpenButton_Click(object sender, RoutedEventArgs e)
{
OpenFileDialog openFileDialog = new OpenFileDialog();
openFileDialog.Multiselect = false;
openFileDialog.Filter = "Image files (*.png;*.jpeg)|*.png;*.jpeg|All files (*.*)|*.*";
if (openFileDialog.ShowDialog() == true)
{
ImageBox.Source= /*hard to miss lack of knowledge*/;
}
}
but I'm not sure it's the right way to do it. For the interpolation part I've found the method:
RenderOptions.SetBitmapScalingMode(ImageBox, BitmapScalingMode.HighQuality);
But the Microsoft docs didn't say anything about scaling it to a predefined height and width and I want to make it for example 200x200 if the given image is square.
Thanks in advance

Create a BitmapImage and set its DecodePixelWidth or DecodePixelHeight property:
if (openFileDialog.ShowDialog() == true)
{
var bitmap = new BitmapImage();
bitmap.BeginInit();
bitmap.UriSource = new Uri(openFileDialog.FileName);
bitmap.DecodePixelHeight = 200;
bitmap.EndInit();
ImageBox.Source = bitmap;
}

Attach Image/ImageBrush from code behind

I'm trying to add an Image as the background of a UserControl. Depending on the value of a variable I need to change that background but whatever the path or Uri format I use, the background does not change.
I've seen lots of questions here in stackoverflow but none fixes my single problem.
I let the code below:
if (callback.liveUvis.ContainsUVI(uvi))
{
this.Status.Text = "LIVE";
ImageBrush imgB = new ImageBrush();
BitmapImage btpImg = new BitmapImage();
btpImg.UriSource = new Uri(#"///IMG///Live///bck_frame_info_video_live.png", UriKind.Relative);
//imgB.ImageSource = new BitmapImage(new Uri("~/IMG/Live/bck_frame_info_video_live.png", UriKind.RelativeOrAbsolute));
//imgB.ImageSource = new BitmapImage(new Uri("ms-appx:///IMG/Live/bck_frame_info_video_live.png"));
imgB.ImageSource = btpImg;
this.Background = imgB;
}
I'm facing the same problem when trying to attach an image... I guess it's up to the Uri format also, but I let the code too just in case :)
private void setIcon_Desc(string dd)
{
try
{
Image img = new Image();
img.Source = new BitmapImage(new Uri(this.BaseUri, "IMG/pictos_small/white/160dpi/" + dd + ".png"));
img.Stretch = Stretch.None;
this.Icon = img;
this.Sport.Text = callback.disc.getDescription(dd).ToUpper();
}
catch(Exception ex)
{
callback.exception.writeExceptions(ex);
}
}
Thanks in advance!

I can reproduce your issue when changing the background of a user control.
The current workaround I used was changing the background of root UIElement in the control.
<Grid x:Name="container">
<Grid.Background>
<ImageBrush Stretch="Fill" ImageSource="Images/bg-blue.png"/>
</Grid.Background>
<StackPanel>
<TextBlock>Hello World</TextBlock>
<Button Click="Button_Click">Change Background</Button>
<Image x:Name="display"></Image>
</StackPanel>
</Grid>
public sealed partial class MyUserControl : UserControl
{
public MyUserControl()
{
this.InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
ImageBrush imgB = new ImageBrush();
BitmapImage btpImg = new BitmapImage();
btpImg.UriSource = new Uri(#"ms-appx:///images/bg-light-blue.png");
imgB.ImageSource = btpImg;
container.Background = imgB;
}
}

Load images in Image Button

I am using below code to load image in my image button. But the Image is not loading in Button. However, I'm not receiving any kind of error.
XAML Code:
Image Name="imgPhoto" HorizontalAlignment="Left" Height="160" Margin="10,41,0,0" VerticalAlignment="Top" Width="164"/>
Button Content="Load" HorizontalAlignment="Left" Margin="191,67,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click_1"/>
Below is the code to load the Image in Image Button.
Button Click Event Code:
private void Button_Click_1(object sender, RoutedEventArgs e)
{
OpenFileDialog dlg = new OpenFileDialog();
dlg.Filter = "Image files (*.jpg)|*.jpg|All Files (*.*)|*.*";
if (dlg.ShowDialog() == true)
{
string selectedFileName = dlg.File.Name;
imgPhoto.Source = new BitmapImage(new Uri(selectedFileName, UriKind.Relative));
}
}

with OpenFIleDialog we don't have File.Name we have only FileName property which Gets or sets a string containing the file name selected in the file dialog box.
check the below code
OpenFileDialog objOpenFileDialog = new OpenFileDialog();
objOpenFileDialog.Filter = "Image Files(.jpg)|*.jpg;*.gif;*.png";
if (objOpenFileDialog.ShowDialog() == true)
{
imgPhoto.Source =new BitmapImage(new Uri(objOpenFileDialog.FileName));
}

The problem is here: UriKind.Relative.
If you're building URI from file name, picked up from system's file dialog, then it is absolute URI:
myImage.Source = new BitmapImage(new Uri(fileDialog.FileName));
In other words, you should treat full path (e.g., "c:\folder\filename.ext") as absolute URI.

Change imgPhoto.Source code as below
private void Button_Click_1(object sender, RoutedEventArgs e)
{
Microsoft.Win32.OpenFileDialog dlg = new Microsoft.Win32.OpenFileDialog();
dlg.Filter = "Image files (*.jpg)|*.jpg|All Files (*.*)|*.*";
if (dlg.ShowDialog() == true)
{
string selectedFileName = dlg.FileName;
//imgPhoto.Source = new BitmapImage(new Uri(selectedFileName, UriKind.Relative));
imgPhoto.Source = (ImageSource)new ImageSourceConverter().ConvertFromString(selectedFileName);
}
}

Dynamically add pictures to Windows forms application

I am currently trying to insert a new PictureBox and show it with its associated image.I am creating PictureBox every time i open a new image. But it doesn't show after the dialog is closed. I am also trying to store the PictureBox objects in a list.
Here is the code I have written :
OpenFileDialog FileDlg = new OpenFileDialog();
FileDlg.Filter = "Image files (*.jpg, *.jpeg, *.png, *.bmp) | *.jpg; *.jpeg; *.png, *.bmp";
if (FileDlg.ShowDialog() == DialogResult.OK)
{
PictureBox picBox = new PictureBox();
picBox.Name = "PictureBox" + m_nPictureBoxCounter.ToString();
m_picboxList.Add(picBox);
picBox.Image = Image.FromFile(FileDlg.FileName);
picBox.BringToFront();
picBox.Location = new Point(10, 10);
picBox.Size = new Size(500, 500);
picBox.Visible = true;
}

You need to add picturebox into a control, i.e.:
this.controls.add(picBox);

OpenFileDialog FileDlg = new OpenFileDialog();
FileDlg.Filter = "Image files (*.jpg, *.jpeg, *.png, *.bmp) | *.jpg; *.jpeg; *.png, *.bmp";
if (FileDlg.ShowDialog() == DialogResult.OK)
{
var picBx = new PictureBox();
picBx.ImageLocation = FileDlg.FileName;
this.Controls.Add(picBx);
}
That should put you in the right place. You can adjust position and other properties as you see fit.

Thanks to Btc Sources i figured out the answer. I had to ad :
picBox.Parent = this;
picBox.BringToFront();

make ScrollViewer resize when the MainWindow resizes

This is an attempt to implement a read-only Linux text file (one byte newline sequence) viewer for Windows.
It presently has a ScrollViewer that will not resize when the WPF MainWindow is resized. How do I make the ScrollViewer size subservient to the MainWindow?
private void ScrollViewer1GotFocus(object sender, RoutedEventArgs e)
{
Microsoft.Win32.OpenFileDialog dlg =
new Microsoft.Win32.OpenFileDialog();
dlg.FileName = "Document";
dlg.DefaultExt = ".txt";
dlg.Filter = null;
Nullable<bool> result = dlg.ShowDialog();
if (result == true)
{
string filename = dlg.FileName;
StreamReader streamReader = new StreamReader(filename,
System.Text.Encoding.ASCII);
string text = streamReader.ReadToEnd();
FlowDocument flowDocument = new FlowDocument();
flowDocument.TextAlignment = TextAlignment.Left;
flowDocument.FontFamily = new FontFamily("Lucida Console");
Paragraph paragraph = new Paragraph();
paragraph.Inlines.Add(text);
flowDocument.Blocks.Add(paragraph);
FlowDocumentScrollViewer fdsv = new FlowDocumentScrollViewer();
fdsv.Document = flowDocument;
ScrollViewer1.Content = fdsv;
}
}
private void MainWindow1SizeChanged(object sender, SizeChangedEventArgs e)
{
}
The XAML:
<Window x:Name="MainWindow1" x:Class="ReadOnlyViewLinux1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="ReadOnlyView" Height="256" Width="512" SizeChanged="MainWindow1SizeChanged">
<ScrollViewer x:Name="ScrollViewer1" HorizontalAlignment="Left" Height="236" Margin="10,10,0,-21" VerticalAlignment="Top" Width="492" GotFocus="ScrollViewer1GotFocus"/>

Simply Leave the ScrollViewer with no Height, Width, or Margin properties:
<Window>
<ScrollViewer/>
</Window>