search

spiegelp / MaterialDesignExtensions

Material Design Extensions is based on Material Design in XAML Toolkit to provide additional controls and features for WPF apps
https://spiegelp.github.io/MaterialDesignExtensions/
MIT License
754 stars 122 forks source link

PersistentSearch #120

Open kamelEddinee opened 3 years ago

kamelEddinee commented 3 years ago

hey i didn't really know where to put my question but i think this is the best place ,i just locked to the PersistentSearch controls demo and didn't really understand how it work ,i added SearchSuggestionsSource as BindableCollection , is there any thing i'm missing ? , and how to change search icon ? , and is the list have datatemplate ? , thank you in advance

michaldivis commented 3 years ago

EDIT: I've updated the Persistent Search and Autocomplete. The new documentation is currently waiting to be merged. See PR #127

Hey, I'd suggest to check out the demo app in this repository as the use of the PersistentSearch control is demostrated there. Here are links to the specific demo files: https://github.com/spiegelp/MaterialDesignExtensions/blob/master/MaterialDesignExtensionsDemo/Controls/SearchControl.xaml

https://github.com/spiegelp/MaterialDesignExtensions/blob/master/MaterialDesignExtensionsDemo/ViewModel/SearchViewModel.cs

Change search icon

make sure to include this xmlns:md="http://materialdesigninxaml.net/winfx/xaml/themes"

set the PersistentSearch control's SearchIcon property to the desired icon

<mde:PersistentSearch
    SearchIcon="{x:Static md:PackIconKind.TestTube}"
    SearchSuggestionsSource="{Binding Path=SearchSuggestionsSource}" />

Other icons

The 'back' and 'cancel' icons aren't editable at the moment. However, you can always copy the MaterialDesignPersistentSearch style and edit it to suit your needs. To change the icons in this style, it's these two lines:

'back' icon

<md:PackIcon Kind="ArrowLeft" Width="{TemplateBinding IconSize}" Height="{TemplateBinding IconSize}" />

'cancel' icon

<md:PackIcon Kind="Close" Width="{TemplateBinding IconSize}" Height="{TemplateBinding IconSize}" />