как сделать приложение для Windows Phone LongListSelector с изображением и строками

я сделал простое приложение для выбора длинного списка без заголовка перехода или шаблона заголовка. я сделал это после долгого путешествия в Google и переполнения стека. я был доволен этим. приложение содержит только текстовые блоки для отображения имен, например, имя, фамилию, номер телефона, но мне нужно добавить фотографии, а также код, как отображать изображения вместе с именами. я много искал, не мог найти правильного решения, вот мой код:

namespace listparee6
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();
            // Sample code to localize the ApplicationBar
            //BuildLocalizedApplicationBar();
            List<SpeedDial> speeddial = new List<SpeedDial>();
            speeddial.Add(new SpeedDial ( "deepu", "43" ));
            speeddial.Add(new SpeedDial ( "anoop","32" ));
            speeddial.Add(new SpeedDial ( "abhilash","76"  ));
            SpeedDialLLS.ItemsSource = speeddial;
        }

        public class SpeedDial
        {

            public string Name { get; set;}
            public String Phone { get; set; }
            public SpeedDial(string peru, string num) 
            {this.Phone=num ;
            this.Name = peru;
            }
           }
    }
}

data-binding c# windows-phone-8 longlistselector
person DEEPU MATHEW    schedule 27.09.2016    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Вот демо XAML

Вам нужно добавить контактное изображение в свой класс

<phone:LongListSelector
                      x:Name="SpeedDialLLS"
                      ItemsSource="{Binding  Path=speeddial}"
                      Background="Transparent"
                      Height="auto"
                      LayoutMode="List"
                      IsGroupingEnabled="True"
                      HideEmptyGroups ="False">
                    <phone:LongListSelector.GroupHeaderTemplate>
                        <DataTemplate>
                            <Border Background="Transparent" Padding="5">
                                <Border Background="Black" BorderBrush="Black" BorderThickness="2" Width="500" 
                                        Height="62" Margin="0,0,0,0" HorizontalAlignment="Left">
                                    <TextBlock Text="{Binding Path=Key}" Foreground="White" FontSize="25" Padding="0" 
                                                FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                </Border>
                            </Border>
                        </DataTemplate>
                    </phone:LongListSelector.GroupHeaderTemplate>
                    <phone:LongListSelector.ItemTemplate>
                        <DataTemplate>

                                        <Grid x:Name="GridItem">
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="150" />
                                                <RowDefinition Height="10"/>
                                            </Grid.RowDefinitions>

                                            <Image x:Name="photoimg" Grid.Row="0" HorizontalAlignment="Left" VerticalAlignment="Center"  Margin="10,0,0,0" Source="{Binding Path=ContactImage}" Height="100" Width="100" ></Image>
                                            <TextBlock x:Name="FirstName" Grid.Row="0" Margin="20,0,0,0"  HorizontalAlignment="Center" VerticalAlignment="Center" Width="250" TextWrapping="Wrap" Foreground="Black" Text="{Binding Path=FirstName}" FontSize="30"></TextBlock>

Надеюсь это поможет.

person Chandni Sirwani    schedule 29.09.2016
comment
Путь привязки = ContactImage . Как обрабатывать эту часть в кодах cc, это ключевой вопрос, который я пытаюсь решить. Не могли бы вы прислать мне код. Я новичок в Windows Phone. Это может быть не очень много, но я не знаю - person DEEPU MATHEW; 30.09.2016

arrow_upward
0
arrow_downward

Я нашел лучший способ сделать это.

Проекту нужны в основном 3 компонента.

  1. XML-файл
  2. файл xml.cs
  3. файл класса

Последствия в основном сделаны в этих файлах.

В файле XML расположите все элементы управления, перетащите элемент управления longlistselector.

<phone:LongListSelector x:Name="LLs" HorizontalAlignment="Left" Height="566" VerticalAlignment="Top" Width="401" Margin="42,144,0,0">
    <phone:LongListSelector.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <Image Source="{Binding Photo}" Height="100" Width="100" HorizontalAlignment="Left"/>
                <TextBlock Text="{Binding Names}" HorizontalAlignment="Right"/>
            </StackPanel>
        </DataTemplate>
    </phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>

xml.cs

public partial class MainPage : PhoneApplicationPage
{
    ObservableCollection<SpeedDial> speedDialList = new ObservableCollection<SpeedDial>();

    // Constructor
    public MainPage()
    {

        InitializeComponent();
        speedDialList = new ObservableCollection <SpeedDial>();
        speedDialList.Add(new SpeedDial() { Names = "deepu", Photo =  new Uri("Image/2.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "jilu", Photo =  new Uri("Image/3.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "tinu", Photo =  new Uri("Image/4.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "jhd", Photo = new Uri("Image/7.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "jose", Photo = new Uri("image/1.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "hgscf", Photo =  new Uri("image/2.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "hjsg", Photo =  new Uri("Image/5.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "jhvdj", Photo =  new Uri("Image/6.jpg" ,UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "jhd", Photo =  new Uri("Image/7.jpg",UriKind.Relative) }); 
        speedDialList.Add(new SpeedDial() { Names = "jkgh", Photo =  new Uri("Image/4.jpg",UriKind.Relative) });
        speedDialList.Add(new SpeedDial() { Names = "kigh", Photo =  new Uri("Image/3.jpg",UriKind.Relative) });
        LLs.ItemsSource = speedDialList;
    }
}
}}

файл класса

namespace yourprojuctname
{
class SpeedDial
    {
       public string name;
        public string Names
        {
            get { return name; }
            set { name = value; }
        }
        private Uri photo;
        public Uri Icon
        {
            get { return photo; }
            set { photo = value; }
        }
    }
}
person DEEPU MATHEW    schedule 01.04.2017