Aracılığıyla paylaş


XAML öğeleri denetimleri; C++/WinRT koleksiyonuna bağlama

Bir XAML öğeleri denetimine etkili bir şekilde bağlanabilen koleksiyon, gözlemlenebilir koleksiyon olarak bilinir. Bu fikir,gözlemci deseni olarak bilinen yazılım tasarım desenini temel alır. Bu konu C ++/WinRT'de gözlemlenebilir koleksiyonların nasıl uygulanacağını ve XAML öğeleri denetimlerinin bunlara nasıl bağlanacağını gösterir (arka plan bilgileri için bkz . Veri bağlama).

Eğer bu konuyu takip etmek istiyorsanız, önce XAML denetimlerinde açıklanan projeyi oluşturmanızı ve sonrabir C++/WinRT özelliğine bağlanmanızı öneririz. Bu konu, söz konusu projeye daha fazla kod ekler ve bu konuda açıklanan kavramlara ekler.

Önemli

C++/WinRT ile çalışma zamanı sınıflarını kullanma ve yazma konusundaki anlayışınızı destekleyen temel kavramlar ve terimler için C++/WinRT ile API'leri Kullanma ve C++/WinRT ile API'leri Yazma başlıklarına bakın.

gözlemlenebilir bir koleksiyon için ne anlama gelir?

Bir koleksiyonu temsil eden bir çalışma zamanı sınıfı, bir öğe eklendiğinde veya kaldırıldığında IObservableVector<T>::VectorChanged olayını tetiklemeyi seçerse, çalışma zamanı sınıfı gözlemlenebilir bir koleksiyondur. XAML öğeleri denetimi, güncelleştirilmiş koleksiyonu alıp geçerli öğeleri gösterecek şekilde kendisini güncelleştirerek bu olaylara bağlanabilir ve bunları işleyebilir.

Uyarı

C++/WinRT Visual Studio Uzantısı (VSIX) ve NuGet paketini (birlikte proje şablonu ve derleme desteği sağlayan) yükleme ve kullanma hakkında bilgi için bkz. C++/WinRTiçin Visual Studio desteği .

BookstoreViewModel'eBookSkus koleksiyonu ekleme

XAML denetimlerinde,C++/WinRT özelliğine bağlanırken, ana görünüm modelimize BookSku türünde bir özellik ekledik. Bu adımda, aynı görünüm modeli üzerinde BookSku gözlemlenebilir bir koleksiyon uygulamamıza yardımcı olması için winrt::single_threaded_observable_vector fabrika işlevi şablonunu kullanacağız.

BookstoreViewModel.idliçinde yeni bir özellik tanımlayın.

// BookstoreViewModel.idl
...
runtimeclass BookstoreViewModel
{
    BookSku BookSku{ get; };
    Windows.Foundation.Collections.IObservableVector<BookSku> BookSkus{ get; };
}
...

Önemli

C++/WinRT ile bir koleksiyona bağlanmak, C# ile olduğundan biraz daha incedir. MIDL 3.0 listesindeki yukarıdaki örnekte, BookSkus özelliğinin IObservableVector türünün BookSkuolduğunu unutmayın. Bu konunun sonraki bölümünde ListBox'ın öğe kaynağını BookSkus'a bağlayacağız. Liste kutusu bir öğe denetimidir ve ItemsControl.ItemsSource özelliğini doğru ayarlamak için, bunu IObservableVector veya IVector türünde bir değere ya da IBindableObservableVector gibi birlikte çalışabilirlik türüne ayarlamanız gerekir. Aksi takdirde, {x:Bind}E_INVALIDARG oluşturur ve {Binding} sessizce başarısız olur.

Uyarı

Bu konuda gösterilen kod C++/WinRT sürüm 2.0.190530.8 veya üzeri için geçerlidir. Önceki bir sürümü kullanıyorsanız, gösterilen kodda bazı küçük ayarlamalar yapmanız gerekir. Yukarıdaki MIDL 3.0 listesinde, BookSkus özelliğini IObservableVectorIInspectableolarak değiştirin. Ardından uygulamanızda da IInspectable ( BookSku yerine) kullanın.

Kaydet ve derle. BookstoreViewModel.h ve BookstoreViewModel.cpp içerisindeki erişimci taslaklarını \Bookstore\Bookstore\Generated Files\sources klasörüne kopyalayın (daha fazla ayrıntı için önceki konuya, XAML denetimleri; C++/WinRT özelliğine bağlamabölümüne bakın). Bu erişimci saplamalarını aşağıdaki gibi uygulayın.

// BookstoreViewModel.h
...
struct BookstoreViewModel : BookstoreViewModelT<BookstoreViewModel>
{
    BookstoreViewModel();

    Bookstore::BookSku BookSku();

    Windows::Foundation::Collections::IObservableVector<Bookstore::BookSku> BookSkus();

private:
    Bookstore::BookSku m_bookSku{ nullptr };
    Windows::Foundation::Collections::IObservableVector<Bookstore::BookSku> m_bookSkus;
};
...
// BookstoreViewModel.cpp
...
BookstoreViewModel::BookstoreViewModel()
{
    m_bookSku = winrt::make<Bookstore::implementation::BookSku>(L"Atticus");
    m_bookSkus = winrt::single_threaded_observable_vector<Bookstore::BookSku>();
    m_bookSkus.Append(m_bookSku);
}

Bookstore::BookSku BookstoreViewModel::BookSku()
{
    return m_bookSku;
}

Windows::Foundation::Collections::IObservableVector<Bookstore::BookSku> BookstoreViewModel::BookSkus()
{
    return m_bookSkus;
}
...

BookSkus özelliğine ListBox bağlama

ana kullanıcı arabirimi sayfamız için XAML işaretlemesini içeren MainPage.xamlaçın. Aşağıdaki işaretlemeyi Düğme ile aynı StackPanel içine ekleyin.

<ListBox ItemsSource="{x:Bind MainViewModel.BookSkus}">
    <ItemsControl.ItemTemplate>
        <DataTemplate x:DataType="local:BookSku">
            <TextBlock Text="{x:Bind Title, Mode=OneWay}"/>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ListBox>

MainPage.cppiçinde, tıklama olay işleyicisine koleksiyona bir kitap eklemek için bir kod satırı ekleyin.

// MainPage.cpp
...
void MainPage::ClickHandler(IInspectable const&, RoutedEventArgs const&)
{
    MainViewModel().BookSku().Title(L"To Kill a Mockingbird");
    MainViewModel().BookSkus().Append(winrt::make<Bookstore::implementation::BookSku>(L"Moby Dick"));
}
...

Şimdi projeyi derleyin ve çalıştırın. Click olay işleyicisini yürütmek için düğmeye tıklayın. Append uygulamasının kullanıcı arabirimine koleksiyonun değiştiğini bildirmek için bir olay oluşturduğunu gördük; ve ListBox kendi Items değerini güncelleştirmek için koleksiyonu yeniden sorgular. Daha önce olduğu gibi, kitaplardan birinin başlığı değişir; ve bu başlık değişikliği hem düğmeye hem de liste kutusuna yansıtılır.

Önemli API'ler