Develop Reference

Downloading and Displaying pdf files from internet

I have a UWP that allows me to display a pdf from a website url. It's also able to display a pdf from the project folder.
However, I am trying to display a picture placed in the local app folder with a button.
I have tried searching through google and found no workable solution. Does anyone have any suggestions to help?

You can refer to the sample in the official documentation Image Class.
Setting Image.Source.
Setting Image.Source using code.
Or use FileOpenPicker to select a picture in a local folder.
Page.xaml
<Image x:Name="image"></Image>
<Button Content="Button" Click="Button_Click"/>
Page.xaml.cs
private async void Button_Click(object sender, RoutedEventArgs e)
{
FileOpenPicker picker = new FileOpenPicker();
picker.FileTypeFilter.Add(".jpg");
picker.FileTypeFilter.Add(".jpeg");
picker.FileTypeFilter.Add(".png");
picker.FileTypeFilter.Add(".bmp");
picker.SuggestedStartLocation = PickerLocationId.PicturesLibrary;
var file = await picker.PickSingleFileAsync();
if (file != null)
{
IRandomAccessStream ir = await file.OpenAsync(FileAccessMode.Read);
BitmapImage bi = new BitmapImage();
await bi.SetSourceAsync(ir);
image.Source = bi;
}
}
UPDATE
Put your image path in Source.
Page.xaml
<Image x:Name="image" Width="200" Source="Assets/StoreLogo.png" Visibility="Collapsed"></Image>
<Button Content="Button" Click="Button_Click"/>
Page.xaml.cs
private void Button_Click(object sender, RoutedEventArgs e)
{
if (image.Visibility == Visibility.Collapsed)
{
image.Visibility = Visibility.Visible;
}
else
{
image.Visibility = Visibility.Collapsed;
}
}

Drag & Drop from explorer to wpf element

Everything seems to be simple and there are quite a few tutorials, but I cannot transfer data (in my case, an image) to a wpf window element. I was able to implement the transfer of an image from one element to another. But when I capture an image (for example, a desktop), when I transfer it to the desired element, the transfer option does not even appear, only a crossed-out circle and does not work out more than one event associated with drop (as if AllowDrop = false)
My code:
XAML
<Image x:Name="mainContent" Grid.Column="1" Stretch="Fill" AllowDrop="True" Drop="MainContent_Drop" />
C#
private void SpImageLeft_MouseDown(object sender, MouseButtonEventArgs e)
{
Image image = sender as Image;
DragDrop.DoDragDrop(image, image, DragDropEffects.Copy);
}
private void MainContent_Drop(object sender, DragEventArgs e)
{
Image image = (Image)e.Data.GetData(typeof(Image));
mainContent.Source = image.Source;
}
I understand that when I take an image from explorer it will be different there, something like this, but it still does not even show that you can add an image
private void MainContent_Drop(object sender, DragEventArgs e)
{
string[] arr = (string[])e.Data.GetData(DataFormats.FileDrop);
mainContent.Source = (ImageSource)new ImageSourceConverter().ConvertFromString(arr[0]);
}

The following worked for me as a Drop event handler for an Image control:
private void OnMainImageDrop(object sender, DragEventArgs e)
{
if (sender is Image image && e.Data.GetDataPresent(DataFormats.FileDrop))
{
if (e.Data.GetData(DataFormats.FileDrop) is string[] filePaths)
{
image.Source.Freeze();
string filePath = filePaths[0];
var uriSource = new Uri(filePath);
var imageSource = new BitmapImage(uriSource);
image.Source = imageSource;
}
}
}
I used a placeholder image to make sure the image had a size and served as a mouse hover surface.
XAML:
<Image x:Name="MainImage" Grid.Row="1"
Source="Images/DotNetLogo.png"
Stretch="Uniform"
AllowDrop="True" Drop="OnMainImageDrop"/>

How can I use Listbox items with WPF?

I am trying to learn Wpf.
When the program runs, it gives me the "no listbox source" error.
I am working on a Wpf design but I just started.
The features I have added to the listbox externally, how can I show them as sources. I have no idea about this. I think I have been researching this for 2 hours but I have not found any answer. I have some problems with English. I hope I won't bother you. All details of my codes are below.
Thank you in advance for helping.
//Note : My Class : (public partial class MainWindow : Window)
public void btnListAdd_Click(object sender, RoutedEventArgs e)
{
CronList1.Items.Clear(); // ListBox <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
OpenFileDialog f = new OpenFileDialog();
if (f.ShowDialog().HasValue == true)
{
List<string> lines1 = new List<string>();
using (StreamReader r = new StreamReader(f.OpenFile()))
{
string line;
while ((line = r.ReadLine()) != null)
{
CronList1.Items.Add(line); // ListBox <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
}
}
}
}
2 : I then try to read all in the CronList. I run the method in the class.
CronEvent cronEvent = new CronEvent();
Task.Run(cronEvent.Cron1);
3 :My Code Dont Run!
public async Task Cron1()
{
int sayix = 1;
while (true)
{
try
{
(HttpWebRequest) rq WebRequest.Create(mainWindow.CronList1.Items[sayix].ToString());
rq .Proxy = WebRequest.GetSystemWebProxy();
rq .AllowAutoRedirect = false;
rq .Timeout = 10000;
HttpWebResponse rply= (HttpWebResponse)rq.GetResponse();
StreamReader streamReader = new StreamReader(rply.GetResponseStream());
rply.Close();
streamReader.Close();
mainWindow.CronList1.SelectedIndex = sayix;
sayix++;
if (sayix == mainWindow.CronList1.Items.Count)
{
sayix = 0;
}
}
catch (Exception e)
{
MessageBox.Show(e.Message);
}
await Task.Delay(TimeSpan.FromSeconds(Convert.ToDouble(mainWindow.txtTime.Text)));
}
}
WPF Listbox Code
<ListBox Name="CronList1" Height="390" Margin="2,7,4,0" VerticalAlignment="Top" BorderBrush="Red" Cursor="Arrow" IsSynchronizedWithCurrentItem="False" BorderThickness="1" ClipToBounds="True" SnapsToDevicePixels="True" Grid.Row="1" Grid.RowSpan="2" Grid.Column="1">
<ListBox.ItemBindingGroup>
<BindingGroup/>
</ListBox.ItemBindingGroup>
<ListBox.Effect>
<hc:BrightnessEffect/>
</ListBox.Effect>
</ListBox>

I would recomend using a "data binding" in a ViewModel to make the code more readable.
You create a class (e.g. MainViewModel) and in there you create an ObservableCollection where you add or remove items from.
In the View (xaml file) you then add this ViewModel as a Source and use a Binding to add the items of the collection to your ListView.
Here is an example
Let me know if you can't get it to work.

Image NOT displaying in Windows Phone 8

I am facing an issue while displaying an image from ApplicationData.Current.LocalFolder.
I am able to save an image and store it in LocalFolder, but displaying it in a Image control or LongListSelector, the image does not show up.
Here is the code:
private async void StoreToFile(string imageFileName)
{
StorageFile file = await ApplicationData.Current.LocalFolder.CreateFileAsync(imageFileName, CreationCollisionOption.GenerateUniqueName);
using (Stream current = await file.OpenStreamForWriteAsync())
{
await photoStream.CopyToAsync(current);
}
}
Here is the code to bind:
var folder = ApplicationData.Current.LocalFolder;
var images = await folder.GetFilesAsync();
Recent.ItemsSource = images.ToList();
XAML Code:
<phone:PivotItem Name="pivot1" Header="item2" Background="White">
<phone:LongListSelector x:Name="Recent" Margin="0,0,0,72" ItemsSource="{Binding lst}" >
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel>
<Image Source="{Binding Path}" Width="60"/>
</StackPanel>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</phone:PivotItem>
I am able to bind the path to a TextBlock and able to see the exact path like:
C:\Data\Users\DefApps\AppData{GUID}\Local\bucket.png
But if I bind to an image source, images are not displaying.
Can anyone see what I'm doing wrong?

You need to use the msappx uri scheme:
new Uri("ms-appx:///myimage.jpg");

As ToniPetrina has said in comment - you can't bind to Path, your property should return BitmapImage. There are two approaches that come to my mind:
provide a special getter of your property that will return BitmapImage (some code below)
provide a Converter when binding to IsolatedStorage image - here is very nice example
The sample code for the first solution can look like this:
In Xaml:
<ListBox Name="myList" Grid.Row="2">
<ListBox.ItemTemplate>
<DataTemplate>
<Image Source="{Binding GetImgSource}" Width="60"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
In code behind:
public class Images : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private string imgSource = "";
public string SetImgSource // setter - string
{
set
{
imgSource = value;
RaiseProperty("GetImgSource");
}
}
public BitmapImage GetImgSource // getter - BitmapImage
{
get
{
if (String.IsNullOrEmpty(imgSource)) return null;
BitmapImage temp = new BitmapImage();
using (IsolatedStorageFile ISF = IsolatedStorageFile.GetUserStoreForApplication())
using (IsolatedStorageFileStream file = ISF.OpenFile(imgSource, FileMode.Open, FileAccess.Read))
temp.SetSource(file);
return temp;
}
}
public void RaiseProperty(string property = null)
{
if (this.PropertyChanged != null)
this.PropertyChanged(this, new PropertyChangedEventArgs(property));
}
}
ObservableCollection<Images> myImg = new ObservableCollection<Images>();
myList.ItemsSource = myImg; // somewhere

Image.Location variant for WPF?

I'm a noob when it comes to WPF; In win forms I can do this:
public void blah()
{
using( var o = new OpenFileDialog())
{
if(o.ShowDialog() == DialogResult.OK)
{
PictureBox p = new PictureBox();
p.ImageLocation = o.FileName;
p.AutoSize = SizeMode.AutoSize;
this.Controls.Add(p);
}
}
}
But in WPF I have no idea at all and not even MSDN will give me any clear info on how to insert a pic onto the form at runtime! Can someone please help?
Thank you very much

Basically you need to create a System.Windows.Controls.Image and set its Source to a System.Windows.Media.Imaging.BitmapImage. Then add the image to the Children of the Container. You may want to put the image inside of another container first like a Canvas. Here's a quick translation of your code, but you'll likely need to play with it a bit to get it just right.
public void blah()
{
using( var o = new OpenFileDialog())
{
if(o.ShowDialog() == DialogResult.OK)
{
Image i = new Image();
i.Source = new BitmapImage(o.FileName);
//p.AutoSize = SizeMode.AutoSize; <= not sure about this part.
this.Children.Add(i);
}
}
}

You could use XAML and some bindings (and possibly a converter to convert a string to an image source). It's more in keeping with the WPF way of doing things.
Example without converter:
XAML
<Window
...
x:Name="this"
DataContext="{Binding ElementName=this}">
<Grid>
<ListView ItemsSource="{Binding MyImageCollection}">
<ListView.ItemTemplate>
<DataTemplate>
<Image Source="{Binding}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</Window>
Code Behind
public class Window1 : Window {
public ObservableCollection<ImageSource> MyImageCollection { get; set; }
...
public void blah()
{
using( var o = new OpenFileDialog())
{
if(o.ShowDialog() == DialogResult.OK)
{
MyImageCollection.Add(new BitmapImage(new Uri(o.FileName)));
}
}
}
}

Here is an easier way to do it.
Image.Source = new BitmapImage(new Uri("C:\MyImage.jpg");