Databases
StackOverflow2013
Postsdbo
POWPFToolkit AutoComplete, styling the textbox & dropdown list
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POWPFToolkit AutoComplete, styling the textbox & dropdown list
    primarykey
    data
    text
    <p>I have the following code creating a AutoCompleteBox (using WPFToolkit) that combines Companies and Employees into a single search feature. I am forced to use an ObservableCollection as the AutoCompleteBox does not know how to handle CompositeCollections (at least according to what I could find on the subject).</p> <p>I would like to style the dropdown and textbox such that a Company's text is red and an Employee's text is green. I can set the text color for the entire dropdown as shown in the ResourceDictionary below but cannot find a way to use the DataTrigger (what I have below does not work).</p> <p>I am not sure how to Bind the DataTrigger to the ModelType property of each object in SearchCollection.</p> <p><strong>EDIT:</strong></p> <p>After looking at the code again I realize that there is not a Property called ModelType exposed in the VM, the ModelType property is on each of the objects in SearchCollection. How can I bind to the ModelType of each object in the collection?</p> <p>In XAML:</p> <pre><code> &lt;toolkit:AutoCompleteBox Name="OmniSearchTextBox" ItemsSource="{Binding SearchCollection}" SelectedItem="{Binding Selection, Mode=TwoWay, UpdateSourceTrigger=Explicit}" KeyUp="OmniSearch_KeyUp" MouseLeftButtonUp="OmniSearch_MouseLeftButtonUp" IsTextCompletionEnabled="False" FilterMode="Contains" VerticalAlignment="Top" Margin="10,0" &gt; </code></pre> <p>In VM:</p> <pre><code>public sealed class SearchViewModel : ViewModelBase { private ViewModelLocator _vmLocator; private ObservableCollection&lt;Company&gt; _companyList; private ObservableCollection&lt;Employee&gt; _employeeList; /// &lt;summary&gt; /// Initializes a new instance of the SearchViewModel class. /// &lt;/summary&gt; public SearchViewModel() { try { _vmLocator = new ViewModelLocator(); _searchCompCollection.Add(companies); _searchCompCollection.Add(employees); foreach (Company co in CompanyList) { _searchCollection.Add(co); } foreach (Employee emp in EmployeeList) { _searchCollection.Add(emp); } } catch (Exception ex) { } } private const string CompanyListPropertyName = "CompanyList"; public ObservableCollection&lt;Company&gt; CompanyList { get { return (_vmLocator.CompanyVM).CompanyList; } set { if (_companyList == value) { return; } _companyList = value; RaisePropertyChanged(CompanyListPropertyName); } } private const string EmployeeListPropertyName = "EmployeeList"; public ObservableCollection&lt;Employee&gt; EmployeeList { get { return (_vmLocator.EmployeeVM).EmployeeList; } set { if (_employeeList == value) { return; } _employeeList = value; RaisePropertyChanged(EmployeeListPropertyName); } } private ObservableCollection&lt;ModelBase&gt; _searchCollection = new ObservableCollection&lt;ModelBase&gt;(); public ObservableCollection&lt;ModelBase&gt; SearchCollection { get { return _searchCollection; } } private string _selection = null; private string _origSelection = null; public string Selection { get { return _selection; } set { if (_selection != value) { _origSelection = _selection; _selection = value; try { var item = _searchCollection.Single&lt;Object&gt;(x =&gt; x.ToString() == _selection); this.SelectedObject = item; } catch (Exception ex) { Console.WriteLine(ex); } } } } private object _selectedObject = null; private object _origSelectedObject = null; public object SelectedObject { get { return _selectedObject; } set { if (_selectedObject != value) { _origSelectedObject = _selectedObject; _selectedObject = value; switch(_selectedObject.GetType().BaseType.Name) { case "Company": RaisePropertyChanged("SelectedObject", (Company)_origSelectedObject, (Company)_selectedObject, true); break; case "Employee": RaisePropertyChanged("SelectedObject", (Employee)_origSelectedObject, (Employee)_selectedObject, true); break; default: break; } RaisePropertyChanged("SelectedObject", _origSelectedObject, _selectedObject, true); } } } } </code></pre> <p>In ResourceDictionary (ModelType is a property available in each Model that simply returns the class type, i.e., Company or Employee):</p> <pre><code>&lt;Style TargetType="{x:Type toolkit:AutoCompleteBox}"&gt; &lt;Setter Property="Foreground" Value="DarkCyan" /&gt; &lt;Style.Triggers&gt; &lt;DataTrigger Binding="{Binding Path=SearchCollection.ModelType}" Value="Company"&gt; &lt;Setter Property="Foreground" Value="Red" /&gt; &lt;/DataTrigger&gt; &lt;DataTrigger Binding="{Binding Path=SearchCollection.ModelType}" Value="Employee"&gt; &lt;Setter Property="Foreground" Value="Green" /&gt; &lt;/DataTrigger&gt; &lt;/Style.Triggers&gt; &lt;/Style&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USBrianKE
    1. USBrianKE
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. COYou should be able to bind to your `ModelType` property just using `{Binding ModelType}`, but you have further problems with your `DataTrigger`. I believe that you are trying to set the `Foreground` property of each line in the drop down, but you are actually setting the `Foreground` property of the whole `AutoCompleteBox` control.
      singulars
      1. POWPFToolkit AutoComplete, styling the textbox & dropdown list
      1. USSheridan
    2. CO@Sheridan The code I have posted does set the Text color of the drop down and the text box, but currently it is all set to DarkCyan (via the first setter property). What I cannot get to work is the DataTrigger to set the text color based on the ModelType.
      singulars
      1. POWPFToolkit AutoComplete, styling the textbox & dropdown list
      1. USBrianKE
    3. COAs I said, you are setting the `Foreground` property of the whole AutoCompleteBox control. This won't do what you want and the only way that I can think of is for you to create your own `AutoCompleteTextBox` (which doesn't take that long).
      singulars
      1. POWPFToolkit AutoComplete, styling the textbox & dropdown list
      1. USSheridan
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload