Как отображать элементы по горизонтали в элементе управления списком? - PullRequest
Новая
       32

Как отображать элементы по горизонтали в элементе управления списком?

4 голосов
/ 12 февраля 2011

Я занимаюсь разработкой приложения для windows phone 7. Я новичок в приложении Windows Phone 7. В моем приложении есть следующий элемент управления списком 

<ListBox Margin="0,355,70,205" Name="WeekSummaryListBox" DataContext="{Binding}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Amount}" Foreground="Orange"></TextBlock>
                <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Currency}" Foreground="Orange"></TextBlock>                            
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>

    <ListBox.Template>
        <ControlTemplate>
            <ScrollViewer HorizontalScrollBarVisibility="Visible">
                <ItemsPresenter />
            </ScrollViewer>
        </ControlTemplate>
    </ListBox.Template>
</ListBox>

В приведенном выше списке элементов управления отображаются вертикально. Я хочу, чтобы отображать элементы в списке управления по горизонтали. Поэтому я использую следующий код. 

<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <StackPanel Orientation="Horizontal"/>
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>

но когда я помещаю два текстовых блока в панель стека, это выдает ошибку. Для этого я использую следующий код 

<StackPanel Orientation="Horizontal">
    <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Amount}" Foreground="Orange"></TextBlock>
    <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Currency}" Foreground="Orange"></TextBlock>                            
</StackPanel>

Я пытаюсь ввести следующий код. В следующем коде я получаю ошибку 

<ListBox Margin="0,355,70,205" Name="WeekSummaryListBox" DataContext="{Binding}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Amount}" Foreground="Orange"></TextBlock>
                <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Currency}" Foreground="Orange"></TextBlock>
            </StackPanel>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.Template>
        <ControlTemplate>
            <ScrollViewer HorizontalScrollBarVisibility="Visible">
                <ItemsPresenter />
            </ScrollViewer>
        </ControlTemplate>
    </ListBox.Template>
</ListBox>

Я получаю сообщение об ошибке «Невозможно явно изменить дочернюю коллекцию Panel, используемую в качестве ItemsPanel для ItemsControl.ItemsControl, создает дочерние элементы для Panel»

Я использую следующую функцию для отображения данных в ListBox: 

public void WeekSumValue(int TransactionType_ID)
{
    UserInterfaceManager UserInterfaceManagerObj = new UserInterfaceManager();
    List<UserInterfaceManager.TotalSummary> WeekSummary = new List<UserInterfaceManager.TotalSummary>();           
    ObservableCollection<AmountCurrency> WeekIncomeSumCollection = new ObservableCollection<AmountCurrency>();

    WeekSummary = UserInterfaceManagerObj.LoadWeekSum(SelectedButtonName, TransactionType_ID, selectedDate);

    foreach (UserInterfaceManager.TotalSummary vWeekSummary in WeekSummary)
    {
        WeekIncomeSumCollection.Add(new AmountCurrency(vWeekSummary.Amount, vWeekSummary.Currency));
    }

    if (WeekIncomeSumCollection.Count != 0 && SummaryCombobox.SelectedIndex == 0)
    {
        WeekSummaryListBox.ItemsSource = WeekIncomeSumCollection;
    }
    else if (WeekIncomeSumCollection.Count != 0 && SummaryCombobox.SelectedIndex == 2)
    {
        MonthSummaryListBox.ItemsSource = WeekIncomeSumCollection;
    }
    else
    {
        ObservableCollection<TextBlock> NoRecordsCollection = new ObservableCollection<TextBlock>();
        TextBlock NoRecordsTextBlock = new TextBlock();
        NoRecordsTextBlock.Text = "No record found";
        NoRecordsTextBlock.FontSize = 25;
        NoRecordsTextBlock.Foreground = new SolidColorBrush(Colors.Gray);
        NoRecordsCollection.Add(NoRecordsTextBlock);

        if (SummaryCombobox.SelectedIndex == 0)
            WeekSummaryListBox.ItemsSource = NoRecordsCollection;

        if (SummaryCombobox.SelectedIndex == 2)
            MonthSummaryListBox.ItemsSource = NoRecordsCollection;
    }
}

В вышеприведенной функции данные поступают динамически. Может быть две, три или более записей, также не может быть записей. Я связываю эти динамические данные с текстовыми блоками, которые находятся внутри списка

Я использую следующий класс, использованный в приведенном выше коде 

public class AmountCurrency
{
    public int Amount { get; set; }
    public String Currency { get; set; }

    public AmountCurrency(int Amount, String Currency)
    {
        this.Amount = Amount;
        this.Currency = Currency;
    }
}

Как мне поместить два вышеупомянутых текстовых поля в список, который будет отображать элементы по горизонтали? Можете ли вы предоставить мне какой-либо код или ссылку, с помощью которой я могу решить вышеуказанную проблему? Если я делаю что-то не так, то, пожалуйста, направь меня.

Ответы [ 2 ]

9 голосов
/ 23 февраля 2011

Мне кажется, у вас есть два текстовых блока внутри неправильной части шаблона.

Эти два текстовых блока должны быть в ListBox.ItemTemplate, а не в ListBox.ItemsPanelTemplate: 

<ListBox ItemsSource="{Binding Items}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"></StackPanel>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Margin="0,0,0,17" Width="300" Orientation="Horizontal">
                <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Amount}" Foreground="Orange"></TextBlock>
                <TextBlock TextWrapping="Wrap" Width="150" Text="{Binding Currency}" Foreground="Orange"></TextBlock>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

Если вы хотите понять, как работает этот элемент управления, начните с рабочего «базового» элемента управления, который показывает элементы , а затем посмотрите на добавление ItemsPanelTemplate к этому рабочему образцу.

0 голосов
/ 12 февраля 2011

Замените DataContext="{Binding}" на ItemsSource="{Binding}", который работает для меня.

...