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

Я новичок в MVVM. У меня есть основной проект «MVVM Demo», который включает файл mainwindow.xaml, в котором есть мой основной интерфейс. У меня есть список, в котором есть набор элементов:

<ListBox Name="ButtonPanel" ItemsSource="{Binding BoardTabs}" SelectedItem="{Binding SelectedTab, Mode=TwoWay}" >
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <TextBlock Text="{Binding Connect}"  >
                            </TextBlock>
                            <TextBlock Text="{Binding I2C}"  >
                            </TextBlock>
                            <TextBlock Text="{Binding Voltage}" >
                            </TextBlock>
                            <TextBlock Text="{Binding Clock}" >
                            </TextBlock>
                            <TextBlock Text="{Binding Codec}" >
                            </TextBlock>
                            <TextBlock Text="{Binding EEPROM}" >
                            </TextBlock>
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

Мне нужно, чтобы каждый элемент списка открывал новый пользовательский элемент управления соответственно. Имейте в виду, что я создал отдельные пользовательские элементы управления вне основного проекта (второй проект в моем файле решения) и добавил его в качестве ссылки на основной проект (управление платой mvvm)

Voltage - это один из элементов userControl, у которого есть файл Voltage.xaml, в котором находится мой пользовательский интерфейс, который имеет отдельный вид, модель и класс модели представления. Оно внезапно появляется в новом окне в тот момент, когда я щелкаю элемент напряжения (текстовый блок внутри списка) в моем MainWindow.xaml, который находится в проекте Board Control MVVM.

вот мой класс модели ProductView, который выбирает вкладку из пользовательского интерфейса mainwindow.xaml:

private Product m_SelectedTab;
    public Product SelectedTab
    {
        get
        {
            return m_SelectedTab;
        }

        set
        {
            m_SelectedTab = value;
            NotifyPropertyChanged("SelectedTab");
        }
    }

Я хочу знать, когда я выбираю элемент в Listbox (mainwindow.xaml), всплывает окно с пользовательским интерфейсом Voltage.xaml, указанным выше. Если вам нужен дополнительный код для четкого описания, я бы с удовольствием загрузил его сюда.

ПОЖАЛУЙСТА ПОМОГИ :(


mvvm data-binding wpf listboxitem
person Mike Portnoy    schedule 10.09.2012    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Просто быть чистым; если Connect, I2C, Voltage и т. д. - это элементы, которые вам нужны в вашем ListBox, то указанный выше Xaml не то, что вы хотите. Поскольку каждый элемент будет иметь все эти текстовые блоки (поскольку вы определяете ItemTemplate как несколько текстовых блоков).

Вместо этого я предполагаю, что вы хотите, чтобы каждый из этих элементов (Connect, I2C и т. Д.) Был элементами вашего ListBox. Опять же, предполагая, что единственное, что вы хотите сделать, это открыть другую страницу, тогда вы можете использовать HyperlinkButton внутри каждого ListBoxItem:

<ListBox x:Name="ListBoxItems" ItemsSource="{Binding Path=Items}">
            <ListBox.ItemTemplate>
                <DataTemplate>                        
                    <HyperlinkButton NavigateUri="{Binding Path=Page}">
                        <HyperlinkButton.Style>
                            <Style TargetType="HyperlinkButton">
                                <Setter Property="HorizontalContentAlignment" Value="Left"/>
                                <Setter Property="HorizontalAlignment" Value="Stretch"/>
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="HyperlinkButton">
                                            <ContentPresenter/>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </HyperlinkButton.Style>
                        <TextBlock Text="{Binding Path=Name}" />                            
                    </HyperlinkButton>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

Здесь Name и Page - это свойства класса Item, который представляет каждый из ваших элементов (Connect, I2C и т. Д.), Где Name является именем (Voltage), а страница - Uri, который указывает на соответствующую страницу, которую вы хотите открыть (/ Voltage. xaml)

ItemsSource ListBox привязан к свойству Items класса ViewModel, причем Items является ObservableCollection объектов Item:

ItemsViewModel viewModel = new ItemsViewModel() {
            Items = new ObservableCollection<Item>() { 
            new Item() { Name = "Item 1", Page = new Uri("/Page1.xaml", UriKind.Relative) },
            new Item() { Name = "Item 2", Page = new Uri("/Page2.xaml", UriKind.Relative) }}
        };

Обратите внимание, что если вы хотите передать дополнительные данные на страницу, вы можете сделать это с помощью строки запроса (/Voltage.xaml?param=blah) или вы можете добавить команду к каждому элементу и самостоятельно управлять навигацией.

person MacGyver    schedule 15.01.2013