locked
Xamarin.forms previewer not showing images RRS feed

  • Question

  • User360865 posted

    so, im using xamarin.forms in a shared project and use embedded images. im trying to get the list view the way i want it and can't keep relaunching the debugger to view each little change. However i can't get the previewer to show the images and that kinda kills the whole thing. The data, on the app, will be pulled from a database to fill the list view and the images have id names that are pulled from the database. this is my placeItem model.

    public int ID { get; set; } public string Town { get; set; } public string Image { get; set; } public ImageSource ImageSource { get { return ImageSource.FromResource(Image); } } public PlaceItem() {} public PlaceItem(string town, string image) { Town = town; Image = image; }

    in the app i made a new class to fill the dummy data.

    public class ExampleData { private static ExampleViewModel dataViewModel; public static ExampleViewModel ViewModel => dataViewModel ?? (dataViewModel = new ExampleViewModel()); public class ExampleViewModel { public ObservableCollection<PlaceItem> NameList { get; set; } = new ObservableCollection<PlaceItem>() { new PlaceItem("town1", "1_food_tours.png"), new PlaceItem("town2", "Amandine_lavenda.png"), new PlaceItem("town3", "Distillery_hero_2.png"),}; } } I have tried just making imagesource a get; set; and having ImageSource.FromResource(Image); set as i make the item just for testing but that didn't seem to work either. the reason i have the extra imagesource is because it was how i got source={Binding imagesource} to work in the actual app for easily displaying images in a list.

    and here is the xaml page

    <?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:CoastlineNews" x:Class="CoastlineNews.ViewModel.PlacesMenuPage" BindingContext="{x:Static local:ExampleData.ViewModel}"> <ContentPage.Content> <ScrollView> <StackLayout> <ListView ItemsSource="{Binding NameList}" Margin="20" ItemSelected="OnListItemSelected"> <ListView.ItemTemplate> <DataTemplate> <ViewCell> <StackLayout MinimumHeightRequest="50" > <StackLayout Margin="10,10,10,10"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="2*" /> <ColumnDefinition Width="auto" /> </Grid.ColumnDefinitions> <Label Grid.Row="0" Grid.Column="0" Text="{Binding Town}" VerticalTextAlignment="Center" HorizontalOptions="StartAndExpand" /> <Image Grid.Row="0" Grid.Column="1" x:Name="TitleImage" Source="{Binding ImageSource}" Aspect="AspectFit" HorizontalOptions="End"/> </Grid> </StackLayout> </StackLayout> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView> </StackLayout> </ScrollView> </ContentPage.Content> </ContentPage>

    Thursday, July 19, 2018 9:56 PM

Answers

  • User360865 posted

    the problem has been fixed.

    Using broker.hivemq.com:1883 to connect it with live reload instead of localhost.

    • Marked as answer by Anonymous Thursday, June 3, 2021 12:00 AM
    Monday, July 23, 2018 12:14 AM

All replies

  • User275216 posted

    Hi @Daedric1991

    I did an example using your code and worked just changing the Image Source Binding to the Image property instead of ImageSource.

    See the picture bellow

    Friday, July 20, 2018 6:12 AM
  • User360865 posted

    You did use “photo.png” as the img right? I have tried using both. Image is simply a string name. If I put “photo.png” as the source it never worked. Not even once the app was built.

    The images are embedded photos set in the shared project.

    Friday, July 20, 2018 6:50 AM
  • User275216 posted

    Yes I did.

    See the prints showing all of it.

    Images on the Resource folder

    Image properties

    ViewModel class

    App running on emulator

    I hope this helps somehow.

    Friday, July 20, 2018 8:11 AM
  • User180523 posted

    Previewer never worked well and is now a dead project. Take a look at Xamarin LiveReload. https://docs.microsoft.com/en-us/xamarin/xamarin-forms/xaml/live-reload

    It seems to be a new approach they're taking. A much as I publicly beat on them for their earlier efforts, I want to also put there publicly that the new LIveReload has been treating me really well even though it is still only preview. This is a really promising direction. Its totally awesome to make changes in my XAML and watch it update an Android device, iOS phone and my UWP app all running the, at the same time!

    Friday, July 20, 2018 12:07 PM
  • User360865 posted

    Eric those images are stored right in each of the projects. this forces me to go through and name each of them 3 times. i guess it would be okay for initial design but you are not setting up the project the same way but i really don't want to deviate too much from what the actual code to deploy will be because it will make it harder when other stuff isn't working the way it should because of changes.


    Friday, July 20, 2018 3:33 PM
  • User360865 posted

    ClintStLaurent i looked at livereload and i can't get it working.

    the instructions on the doc page are very simple. install nuget package. add LiveReload.Init(); to app and it's suppose to work.

    instead when i launch the ios debugger or even just "start" from visual studio im stuck with "live reload is enabled buti not listening on localhost:6852" i changed the port from defualt because i thought it was just a bad port and cleaned and rebuilt and i still get the same thing. clicking connect does nothing and no changes are made in the app at all and yes i save the page.

    I have spent so much time the past 3 days looking into trying to speed up my ui design phase that it probably would have been better to keep launching the debugger and basically spending 2/3 of my time waiting for the dam thing to redeploy.... This shouldn't be the case.

    Friday, July 20, 2018 3:40 PM
  • User180523 posted

    @Daedric1991 said: from visual studio im stuck with "live reload is enabled buti not listening on localhost:6852" i changed the port from defualt because i thought it was just a bad port and cleaned and rebuilt and i still get the same thing. clicking connect does nothing

    "Does nothing" - Meaning it never connects? You don't get a change in status showing it is connected?

    You don't have to be actively debugging.
    You do need the PC and the device to be on the same WiFi network Turn off firewall on PC, just to be safe.

    • Delete app from device.
    • Rebuild app in Visual Studio
    • Deploy app from VS
    • Launch on device.
    • Make a change in the XAML file you are currently viewing on the device.
    • Save change.
    • Should see on device.

    But you don't have to be debugging when you make the change.

    Friday, July 20, 2018 3:57 PM
  • User360865 posted

    @ClintStLaurent i click on it and there is 0 response. it doesn't give ANY response, it simply stays as "enabled but not listening" no matter what i do. i can click options and that works. visual studio itself or the ios simulator do not have any issues running the app.

    I am running the ios emulator via visual studio, it connects to my mac on the network but i have the emulator and visual studio running on my windows desktop. I deleted the app from the emulator, rebuilt the app re deployed it and it still wont connect. no changes are shown in the emulator. I even disabled my anti virus to do this encase that was the issue.

    Friday, July 20, 2018 4:22 PM
  • User180523 posted

    So you haven't actually tried it on physical devices?

    Friday, July 20, 2018 4:33 PM
  • User360865 posted

    @ClintStLaurent no, i have never actually deployed anything to a real device yet. i also don't have an ios developer license either. so i don't know how or if i even can. last i checked you had to pay for a $100 license first and i was going to do that when i was close to launching it for my client.

    Friday, July 20, 2018 5:23 PM
  • User180523 posted

    My 2 cents worth... Go get a $50 android tablet from WalMart/Sams Club or your cell phone provider. You can get a huge amount of work done with that throughout the regular day without the big iOS deployment delay. Then once a week on Friday double check the UI is the same on iOS.

    Friday, July 20, 2018 6:33 PM
  • User360865 posted

    sadly, I might actually do that and get an android tablet. I shouldn't have to honestly but this has pushed me back a few days on development already.

    Friday, July 20, 2018 7:29 PM
  • User360865 posted

    @ClintStLaurent said: So you haven't actually tried it on physical devices?

    I now have it running on my physical device. iPhone x running latest ios. i am using the Xamarin Live to load the app it boots up the app just fine and i can test the code and everything works but im still facing the same issues with live reload.

    it still just has "live reload is enabled but not listening on localhost:6852" and clicking connect does not generate a response from anything. the device is connected to the same wifi network.

    Sunday, July 22, 2018 9:48 PM
  • User360865 posted

    the problem has been fixed.

    Using broker.hivemq.com:1883 to connect it with live reload instead of localhost.

    • Marked as answer by Anonymous Thursday, June 3, 2021 12:00 AM
    Monday, July 23, 2018 12:14 AM