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
762 stars 122 forks source link

AutoComplete item #24

Closed shahinesi closed 5 years ago

shahinesi commented 6 years ago

Hi how i convert to data template AutoComplete2.ItemTemplate = db.ARAPTables.Select(w => w.Name).ToArray();

shahinesi commented 6 years ago

@Keboo @spiegelp

spiegelp commented 5 years ago

@shahinesi As I understand your question, you are mixing up data templates with actual data. You seem to be a WPF newbie. Please read some tutorials on data binding, data templating and MVVM pattern in WPF to understand the concepts. The MaterialDesignExtensions library relies heavily on them.

Here is a crash course for using the Autocomplete:

The AutocompleteSource property provides the data. You have to assign an instance implementing MaterialDesignExtensions.Model.IAutocompleteSource. For example, return some entities to supply data to the Autocomplete control:

public class OperatingSystemAutocompleteSource : MaterialDesignExtensions.Model.IAutocompleteSource
{
    public IEnumerable Search(string searchTerm)
    {
        // maybe do some filtering wihtin a Where() method
        return db.ARAPTables.Select(w => w);
    }
}

A data template is not data. It is a partial user interface with data bindings. Data templates will be applied to data in order to generate a user interface backed by/showing the data. You can think of them as a construction plan for buildung a user interface out of data. You will set a data template via the ItemTemplate property. It will be applied to every w entity to generate one item in the popup.

<controls:Autocomplete x:Name="autocomplete" AutocompleteSource="{Binding Path=AutocompleteSource}" SelectedItem="{Binding Path=SelectedItem, Mode=TwoWay}">
    <controls:Autocomplete.ItemTemplate>
        <DataTemplate>
            <!-- here you have one w entity, showing its Name property via binding in the popup list -->
            <TextBlock Text="{Binding Path=Name, Mode=OneWay}" />
        </DataTemplate>
    </controls:Autocomplete.ItemTemplate>
</controls:Autocomplete>

You will find the source code of the demo in AutocompleteControl.xaml and AutocompleteViewModel.