Xamarin Image on Button is crashing - xaml

So I have a Button where I want to add an image, but the app is crashing when the view gets loaded (view doesn't even show up, using Xamarin Live Player). If I create an extra image field the image shows up.
Here is the code:
<Image Grid.Row="3" Source="trash.png"></Image>
<Button Grid.Row="4" Image="trash.png" ></Button>
Any ideas why?

Related

Draggable Images Xamarin

I am trying to create a user interface where a user can drag an image around the screen atop a background image. Currently the DraggableImage is being moved around with some sliders that change DraggableBounds in the view model.
<AbsoluteLayout>
<Image Source="{Binding DraggableImage, Mode=TwoWay}" AbsoluteLayout.LayoutBounds="{Binding DraggableBounds}" />
<Image Source="{Binding FrameImage, Mode=TwoWay}" Aspect="AspectFit" WidthRequest="1300" HeightRequest="500"/>
</AbsoluteLayout>
I've tried using the Pan Gesture that's on Microsofts Xamarin docs with little success. I'm not trying to pan within an image but move a smaller image over a larger. Is there an existing pattern to solve this?

WindowsPhone ListPicker does not "push down" other elements

Code:
<ScrollView>
<StackLayout VerticalOptions="Start">
<local:myListPicker x:Name="LP"></local:myListPicker>
<Label Text="Push me"></Label>
<Label Text="DOWN"></Label>
</StackLayout>
</ScrollView>
I added four Items to the ListPicker, when I tap on it, it opens, but only the first one can be seen, since it does not "push away" the two labels under it.
It looks like the ListPicker is "behind" the two labels, why is that and how to fix?
Additinol Info:
ExpansionMode equals ExpansionMode.ExpansionAllowed.
With 5 or more Items in the List it gets fullscreen (which is totally OK)

Showing placeholder image while loading in Windows Phone 8.1 app

I want to show a placeholder static image in my Windows Phone 8.1 app while loading an image asynchronously from the web.
<Image Name="productImage" Source="{Binding ImgUrl}" />
The Image is inside a ListView in a DataTemplate.
How to know if the Image finished loading, so I can hide the static Image?
If Performance isn't too critical, you can just place two images on top of each other:
<Grid>
<Image Source="The Background Image" />
<Image Source="{Binding ImageUrl}" />
</Grid>
Your downloaded Image will just overlay the background, once it has loaded.
Will only look fine if your images have a fixed size.

Set an image in a button

I'm currently developing a Windows Phone application.
I have a view with a button in which I would like to set an image.
I found a lot of solution through Internet but it still not work.
Actually, it works when I put an URL from the Internet. The image is well displayed on the button but when it's from my resources folder, no image is loaded.
Here is my XAML code to do that :
<Button Grid.Row="1" Command="{Binding ShowSearchFilterCommand}" Height="100" Width="100">
<StackPanel>
<Image Source="resources/SearchFilterIcon.png" />
</StackPanel>
</Button>
I set the build action of my image to "Content". The designer display the image so I don't understand what I did wrong.
You have to set the correct path to your image source as in a way /FolderName/ImageName.png.
If the images are placed inside nested folders set like this
Source="/FirstFolderName/SecondFolderName/.../ImageName.Extnsion"
Try this:
<Button>
<ItemsControl>
<Image Source="/Assets/images/ImageName.png"></Image>
</ItemsControl>
</Button>

ScrollViewer cuts my the image - silverlight 4

I am trying to create a simple image viewer in silverlight.
my code is this:
<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Margin="0" Padding="0" Width="300" Height="300">
<Canvas Width="600" Height="400" Margin="0">
<Image Source="/MapViewer;component/Images/imageFileName.jpg" Stretch="None" Margin="0,0,90,5"></Image>
</Canvas>
</ScrollViewer>
(I used the Canvas because in the future I would like to paint more fixed elements on the image, such as lines, polylines, etc)
This code is working ok except the fact that the ScrollViewer cuts the image: say the image is 800x600, than I can view around 700x500. I dont know if that was clear enough, so I will add a picture:
(this is the original image)
(and this is the picture, as viewed in my application)
As you can see, I cannot view the bottom right corner of the image... can somebody please tell me how to fix this?
It is not the scroll viewer cropping your image, it is the fixed-size canvas where you placed it. If you want your entire image to be visible you need to set the canvas size to be exactly the same size as your image.