I want to Display image from URL in Xamarin Forms Page ,
code work when use http when use https image not appeared , what should i do ?
<Image Aspect="AspectFit" HeightRequest="155">
<Image.Source>
<UriImageSource Uri="{Binding image}"
CacheValidity="14"
CachingEnabled="true"/>
</Image.Source>
</Image>
Related
I have a xaml page where I set Background Image to some Image and it works good on Emulator(API 27) and Android 9.0 real device. When I deploy the same app to another device (Android 8.1 and 7.0), the background Image does not show in these devices.
I have created a new page and added just the background image property and it turns out the same. Worked well on Android 9.0 and Emulator but not on Android 8.1 and lower versions of android. I have also changed the target framework version of my project to API 27 and the minimum to allow Android 7.0 and that didn't help either.
I expect the background image to show across all the devices I deploy on.
This is how I am defining my image in my xaml page:
<AbsoluteLayout>
<Image Source="Mop3.jpg" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" Aspect="AspectFill"></Image>
<StackLayout AbsoluteLayout.LayoutBounds="0.5,0.4,1,0.3" AbsoluteLayout.LayoutFlags="All" Spacing="10">
<Label Text="Cleanliness" TextColor="White" HorizontalTextAlignment="Center" FontSize="Medium" FontAttributes="Italic"></Label>
<Label Text="Starts with us" TextColor="White" HorizontalTextAlignment="Center" FontSize="40" FontAttributes="Bold"></Label>
<Button x:Name="Learnbtn" Text="Learn more" TextColor="White" BackgroundColor="Purple" BorderColor="Purple" CornerRadius="40" BorderWidth="1"
HorizontalOptions="Center" HeightRequest="50" WidthRequest="130" Clicked="GotoHowPage"></Button>
</StackLayout>
<StackLayout AbsoluteLayout.LayoutBounds="0,0.99,1,0.05" AbsoluteLayout.LayoutFlags="All"
Padding="0">
<Button Text="Get Started" BackgroundColor="Transparent" TextColor="White" FontAttributes="Bold" FontSize="Large" BorderRadius="5" Clicked="GotoBothPage"></Button>
</StackLayout>
</AbsoluteLayout>
The Mop3.jpg is the image not showing on other real devices (Android 8.1 and below )
PS: I tried another image and turned out the same, I also created another page in the project and tried setting the image Control and background image property to some image and didn't work too. But worked well when I created a new project and deployed to these devices so I suspect it is something wrong with the current project.
So I found a solution to it.. it turned out the image I was using is large in size and in dimension too and couldn't display properly on Android 8.1 and lower. So I compressed the image at tinypng.com and re added to the drawable folder and it worked well.
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?
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.
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>
I was wondering if it's possible to bind the image path when using an Image as the Panorama Title, the reason why I need a bind for the Source is that when the user have the phone background to "white" the logo would be black, and vice versa.
This is the code I'm using:
<controls:Panorama.TitleTemplate>
<DataTemplate>
<Image Source="/PanoramaApp5;component/Images/logo.png" Margin="14,105,0,10" HorizontalAlignment="Left" Name="logo" Stretch="Fill" VerticalAlignment="Top" Width="700" Height="70"/>
<!--<TextBlock Text="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" FontSize="100" Margin="10,50,0,0" />-->
</DataTemplate>
</controls:Panorama.TitleTemplate>
If I let the default Title (which is text), it will work just fine, but I need it as an image.
Just set an empty binding for your image source, then assign it using the Title property of your panorama:
<controls:Panorama x:Name="Panorama">
<controls:Panorama.TitleTemplate>
<DataTemplate>
<Image Source="{Binding}" />
</DataTemplate>
</controls:Panorama.TitleTemplate>
</controls:Panorama>
Then from the code behind:
this.Panorama.Title = new Uri("uri of your picture");
Just to provide an example of a working version, Facebook uses this same method in the header of their Windows Phone application and instead of user binding they automatically pull photos of the user to stick together and use in the pano