Xaml 不显示绑定到图像集合的LonglistSelector

我有一个xaml页面。xaml页面希望显示两个文本块和一个LonglistSelector

两个文本块数据源来自一个对象（SpecifiedArticle）；LongListSelector项源来自集合（ImageUriCollection）

启动页面时，无法显示图像

两个文本块数据显示良好

<phone:LongListSelector Name="imageList" Margin="13,-30,0,0" 
                                    ItemsSource="{Binding ImageUriCollection}"
                                    ItemTemplate="{StaticResource ItemTemplate}"
                                    LayoutMode="Grid"
                                    GridCellSize="108,108">

            </phone:LongListSelector>

LongListSelector不显示图像；但我确信ImageUriCollection的数据可以从xaml中获取，因为我在图像控件中进行了测试，它可以正常工作

        <Image  Source="{Binding ImageUriCollection[0].ImageSource}" Width="108" Height="108" Stretch="UniformToFill">


        </Image>

ViewModel如下所示：

public partial class DetailsPage : PhoneApplicationPage
    {
        DetailsPageViewModel viewModel = new DetailsPageViewModel();

        public DetailsPage()
        {
            InitializeComponent();

            this.Loaded += new RoutedEventHandler(DetailsPage_Loaded);
        }

        private void DetailsPage_Loaded(object sender, RoutedEventArgs e)
        {
            DataContext = viewModel;
            //imageList.ItemsSource = viewModel.ImageUriCollection;
            //imageList.ScrollTo(imageList.ItemsSource[imageList.ItemsSource.Count - 1]);
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            string ArticleId = "";
            try
            {
                if (NavigationContext.QueryString.TryGetValue("ArticleId", out ArticleId))
                {
                    Debug.WriteLine(ArticleId);
                    viewModel.LoadPage(Int32.Parse(ArticleId));
                    //Debug.WriteLine(viewModel.SpecifiedArticle.Words.ToString());
                    //LayoutRoot.DataContext = new CollectionViewSource { Source = viewModel.SpecifiedArticle };
                }
                else
                {
                    MessageBox.Show("No ArticleId passed in.");
                }
            }
            catch(Exception ex)
            {
                MessageBox.Show("Error in DetailsPage.OnNavigatedTo"); 
            }
        }
    }

public class DetailsPageViewModel : INotifyPropertyChanged
    {
        private bool _isLoading = false;

        public bool IsLoading
        {
            get
            {
                return _isLoading;
            }
            set
            {
                _isLoading = value;
                NotifyPropertyChanged("IsLoading");
            }
        }

        public DetailsPageViewModel()
        {
            this.SpecifiedArticle = new Article();
            this.ImageUriCollection = new ObservableCollection<Photo>();
            this.IsLoading = false;
        }

        private Article specifiedArticle;
        public Article SpecifiedArticle
        {
            get
            {
                return specifiedArticle;
            }
            set
            {
                specifiedArticle = value;
                NotifyPropertyChanged("SpecifiedArticle");
            }
        }

        public ObservableCollection<Photo> ImageUriCollection
        {
            get;
            private set;
        }

        public void LoadPage(int articleId)
        {            
            IsLoading = true;

            ReadArticle(articleId);

        }

        private async void ReadArticle(int articleId)
        {
            try
            {
                Article articleDetails = new Article();
                articleDetails = await CollectionHttpClient.GetAsyncByArticleId(articleId);
                SpecifiedArticle = articleDetails;
                //articleDetails.FirstImage = new Uri(articleDetails.ImagePathList[0]);

                if (articleDetails.ImagePathList != null)
                {
                    foreach (var item in articleDetails.ImagePathList)
                    {
                        Photo p = new Photo();
                        p.ImageSource = new Uri(item);
                        this.ImageUriCollection.Add(p);
                    }
                    //var image = await CollectionHttpClient.GetImageByImageName(articleDetails.ImagePath);
                    //Bytelist.Add(image);
                }
                else
                {
                    this.ImageUriCollection = null;
                }

                IsLoading = false;


            }
            catch(Exception ex)
            {
                MessageBox.Show("sorry, no data.");
                IsLoading = false;
            }

        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (null != handler)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }

    }

public partial class DetailsPage : PhoneApplicationPage
    {
        DetailsPageViewModel viewModel = new DetailsPageViewModel();

        public DetailsPage()
        {
            InitializeComponent();

            this.Loaded += new RoutedEventHandler(DetailsPage_Loaded);
        }

        private void DetailsPage_Loaded(object sender, RoutedEventArgs e)
        {
            DataContext = viewModel;
            //imageList.ItemsSource = viewModel.ImageUriCollection;
            //imageList.ScrollTo(imageList.ItemsSource[imageList.ItemsSource.Count - 1]);
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            string ArticleId = "";
            try
            {
                if (NavigationContext.QueryString.TryGetValue("ArticleId", out ArticleId))
                {
                    Debug.WriteLine(ArticleId);
                    viewModel.LoadPage(Int32.Parse(ArticleId));
                    //Debug.WriteLine(viewModel.SpecifiedArticle.Words.ToString());
                    //LayoutRoot.DataContext = new CollectionViewSource { Source = viewModel.SpecifiedArticle };
                }
                else
                {
                    MessageBox.Show("No ArticleId passed in.");
                }
            }
            catch(Exception ex)
            {
                MessageBox.Show("Error in DetailsPage.OnNavigatedTo"); 
            }
        }
    }

public class DetailsPageViewModel : INotifyPropertyChanged
    {
        private bool _isLoading = false;

        public bool IsLoading
        {
            get
            {
                return _isLoading;
            }
            set
            {
                _isLoading = value;
                NotifyPropertyChanged("IsLoading");
            }
        }

        public DetailsPageViewModel()
        {
            this.SpecifiedArticle = new Article();
            this.ImageUriCollection = new ObservableCollection<Photo>();
            this.IsLoading = false;
        }

        private Article specifiedArticle;
        public Article SpecifiedArticle
        {
            get
            {
                return specifiedArticle;
            }
            set
            {
                specifiedArticle = value;
                NotifyPropertyChanged("SpecifiedArticle");
            }
        }

        public ObservableCollection<Photo> ImageUriCollection
        {
            get;
            private set;
        }

        public void LoadPage(int articleId)
        {            
            IsLoading = true;

            ReadArticle(articleId);

        }

        private async void ReadArticle(int articleId)
        {
            try
            {
                Article articleDetails = new Article();
                articleDetails = await CollectionHttpClient.GetAsyncByArticleId(articleId);
                SpecifiedArticle = articleDetails;
                //articleDetails.FirstImage = new Uri(articleDetails.ImagePathList[0]);

                if (articleDetails.ImagePathList != null)
                {
                    foreach (var item in articleDetails.ImagePathList)
                    {
                        Photo p = new Photo();
                        p.ImageSource = new Uri(item);
                        this.ImageUriCollection.Add(p);
                    }
                    //var image = await CollectionHttpClient.GetImageByImageName(articleDetails.ImagePath);
                    //Bytelist.Add(image);
                }
                else
                {
                    this.ImageUriCollection = null;
                }

                IsLoading = false;


            }
            catch(Exception ex)
            {
                MessageBox.Show("sorry, no data.");
                IsLoading = false;
            }

        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (null != handler)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }

    }

ViewModel如下所示：

public partial class DetailsPage : PhoneApplicationPage
    {
        DetailsPageViewModel viewModel = new DetailsPageViewModel();

        public DetailsPage()
        {
            InitializeComponent();

            this.Loaded += new RoutedEventHandler(DetailsPage_Loaded);
        }

        private void DetailsPage_Loaded(object sender, RoutedEventArgs e)
        {
            DataContext = viewModel;
            //imageList.ItemsSource = viewModel.ImageUriCollection;
            //imageList.ScrollTo(imageList.ItemsSource[imageList.ItemsSource.Count - 1]);
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            string ArticleId = "";
            try
            {
                if (NavigationContext.QueryString.TryGetValue("ArticleId", out ArticleId))
                {
                    Debug.WriteLine(ArticleId);
                    viewModel.LoadPage(Int32.Parse(ArticleId));
                    //Debug.WriteLine(viewModel.SpecifiedArticle.Words.ToString());
                    //LayoutRoot.DataContext = new CollectionViewSource { Source = viewModel.SpecifiedArticle };
                }
                else
                {
                    MessageBox.Show("No ArticleId passed in.");
                }
            }
            catch(Exception ex)
            {
                MessageBox.Show("Error in DetailsPage.OnNavigatedTo"); 
            }
        }
    }

public class DetailsPageViewModel : INotifyPropertyChanged
    {
        private bool _isLoading = false;

        public bool IsLoading
        {
            get
            {
                return _isLoading;
            }
            set
            {
                _isLoading = value;
                NotifyPropertyChanged("IsLoading");
            }
        }

        public DetailsPageViewModel()
        {
            this.SpecifiedArticle = new Article();
            this.ImageUriCollection = new ObservableCollection<Photo>();
            this.IsLoading = false;
        }

        private Article specifiedArticle;
        public Article SpecifiedArticle
        {
            get
            {
                return specifiedArticle;
            }
            set
            {
                specifiedArticle = value;
                NotifyPropertyChanged("SpecifiedArticle");
            }
        }

        public ObservableCollection<Photo> ImageUriCollection
        {
            get;
            private set;
        }

        public void LoadPage(int articleId)
        {            
            IsLoading = true;

            ReadArticle(articleId);

        }

        private async void ReadArticle(int articleId)
        {
            try
            {
                Article articleDetails = new Article();
                articleDetails = await CollectionHttpClient.GetAsyncByArticleId(articleId);
                SpecifiedArticle = articleDetails;
                //articleDetails.FirstImage = new Uri(articleDetails.ImagePathList[0]);

                if (articleDetails.ImagePathList != null)
                {
                    foreach (var item in articleDetails.ImagePathList)
                    {
                        Photo p = new Photo();
                        p.ImageSource = new Uri(item);
                        this.ImageUriCollection.Add(p);
                    }
                    //var image = await CollectionHttpClient.GetImageByImageName(articleDetails.ImagePath);
                    //Bytelist.Add(image);
                }
                else
                {
                    this.ImageUriCollection = null;
                }

                IsLoading = false;


            }
            catch(Exception ex)
            {
                MessageBox.Show("sorry, no data.");
                IsLoading = false;
            }

        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (null != handler)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }

    }

public partial class DetailsPage : PhoneApplicationPage
    {
        DetailsPageViewModel viewModel = new DetailsPageViewModel();

        public DetailsPage()
        {
            InitializeComponent();

            this.Loaded += new RoutedEventHandler(DetailsPage_Loaded);
        }

        private void DetailsPage_Loaded(object sender, RoutedEventArgs e)
        {
            DataContext = viewModel;
            //imageList.ItemsSource = viewModel.ImageUriCollection;
            //imageList.ScrollTo(imageList.ItemsSource[imageList.ItemsSource.Count - 1]);
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            base.OnNavigatedTo(e);

            string ArticleId = "";
            try
            {
                if (NavigationContext.QueryString.TryGetValue("ArticleId", out ArticleId))
                {
                    Debug.WriteLine(ArticleId);
                    viewModel.LoadPage(Int32.Parse(ArticleId));
                    //Debug.WriteLine(viewModel.SpecifiedArticle.Words.ToString());
                    //LayoutRoot.DataContext = new CollectionViewSource { Source = viewModel.SpecifiedArticle };
                }
                else
                {
                    MessageBox.Show("No ArticleId passed in.");
                }
            }
            catch(Exception ex)
            {
                MessageBox.Show("Error in DetailsPage.OnNavigatedTo"); 
            }
        }
    }

public class DetailsPageViewModel : INotifyPropertyChanged
    {
        private bool _isLoading = false;

        public bool IsLoading
        {
            get
            {
                return _isLoading;
            }
            set
            {
                _isLoading = value;
                NotifyPropertyChanged("IsLoading");
            }
        }

        public DetailsPageViewModel()
        {
            this.SpecifiedArticle = new Article();
            this.ImageUriCollection = new ObservableCollection<Photo>();
            this.IsLoading = false;
        }

        private Article specifiedArticle;
        public Article SpecifiedArticle
        {
            get
            {
                return specifiedArticle;
            }
            set
            {
                specifiedArticle = value;
                NotifyPropertyChanged("SpecifiedArticle");
            }
        }

        public ObservableCollection<Photo> ImageUriCollection
        {
            get;
            private set;
        }

        public void LoadPage(int articleId)
        {            
            IsLoading = true;

            ReadArticle(articleId);

        }

        private async void ReadArticle(int articleId)
        {
            try
            {
                Article articleDetails = new Article();
                articleDetails = await CollectionHttpClient.GetAsyncByArticleId(articleId);
                SpecifiedArticle = articleDetails;
                //articleDetails.FirstImage = new Uri(articleDetails.ImagePathList[0]);

                if (articleDetails.ImagePathList != null)
                {
                    foreach (var item in articleDetails.ImagePathList)
                    {
                        Photo p = new Photo();
                        p.ImageSource = new Uri(item);
                        this.ImageUriCollection.Add(p);
                    }
                    //var image = await CollectionHttpClient.GetImageByImageName(articleDetails.ImagePath);
                    //Bytelist.Add(image);
                }
                else
                {
                    this.ImageUriCollection = null;
                }

                IsLoading = false;


            }
            catch(Exception ex)
            {
                MessageBox.Show("sorry, no data.");
                IsLoading = false;
            }

        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (null != handler)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }

    }

public类DetailsPageViewModel:INotifyPropertyChanged
{
私有bool_isLoading=false；
公共布尔孤岛加载
{
收到
{
返回-卸载；
}
设置
{
_isLoading=值；
NotifyPropertyChanged（“IsLoading”）；
}
}
public DetailsPageViewModel（）
{
this.SpecifiedArticle=新文章（）；
this.ImageUriCollection=新的ObservableCollection（）；
this.IsLoading=false；
}
私人物品专用工具；
公共物品专用工具
{
收到
{
返回指定文件；
}
设置
{
specifiedArticle=值；
NotifyPropertyChanged（“SpecifiedArticle”）；
}
}
公共可见集合ImageUriCollection
{
收到
私人设置；
}
公共无效加载页（int articleId）
{            
IsLoading=true；
阅读文章（articleId）；
}
私有异步void ReadArticle（int-articleId）
{
尝试
{
Article articleDetails=新文章（）；
articleDetails=await CollectionHttpClient.GetAsyncByArticleId（articleId）；
SpecifiedArticle=articleDetails；
//articleDetails.FirstImage=新Uri（articleDetails.ImagePathList[0]）；
if（articleDetails.ImagePathList！=null）
{
foreach（articleDetails.ImagePathList中的变量项）
{
照片p=新照片（）；
p、 ImageSource=新Uri（项目）；
这个.ImageUriCollection.Add（p）；
}
//var image=await CollectionHttpClient.GetImageByImageName（articleDetails.ImagePath）；
//添加（图像）；
}
其他的
{
this.ImageUriCollection=null；
}
IsLoading=false；
}
捕获（例外情况除外）
{
Show（“对不起，没有数据”）；
IsLoading=false；
}
}
公共事件属性更改事件处理程序属性更改；
私有void NotifyPropertyChanged（字符串propertyName）
{
PropertyChangedEventHandler处理程序=PropertyChanged；
if（null！=处理程序）
{
处理程序（这是新的PropertyChangedEventArgs（propertyName））；
}
}
}

试试这个-

只需将ItemTemplate数据模板更改为更简单的数据模板

如果可行，一次添加一个更改

<DataTemplate x:Key="ItemTemplate">
    <Image Source="{Binding ImageSource}" Stretch="UniformToFill"/>
</DataTemplate>

---

这是风格问题

删除样式，再试一次，图像显示良好

<phone:LongListSelector Name="imageList" Margin="13,-30,0,0" 
                                    ItemsSource="{Binding ImageUriCollection}"
                                    ItemTemplate="{StaticResource ItemTemplate}"
                                    LayoutMode="Grid"
                                    GridCellSize="108,108">

            </phone:LongListSelector>

---

在JumpListStyle中，它包含不属于xaml的textblock，这就是为什么LonglistSelector在集体绑定后不显示任何内容

@max你能看到列表被填充了吗？？我的意思是，清单上有什么项目吗？是的，我确定，清单上有一些项目。正如我所说，如果我删除longlistselector，我只使用image，它很好，可以获得绑定数据。当我使用longlistselector并将图像控件放入longlistselector时，它fails@max我说的是正在填充LongListSelector，请选中此->ItemsSource=“{Binding ImageUriCollection}”通过更改LongListSelector并通过更改上述datatemplate来检查LongListSelector，使其包含一些其他可见元素，例如带有一些修复文本的textblock，这样，如果LongListSelector填充，您可以看到只有Bindings中存在问题即使我在datatemplate中设置，它也没有显示任何内容，似乎是LongListSelector的问题，你还有别的想法吗？