Windows RT: Snapped mode Change GridView to ListView - c#

When my app is snapped displaying a GridView isn't the best way to present the information. I want to present it in a ListView instead. I also want to change the item template as well.
I currently have a UserControl that accepts the DataContext as the item template so I can simply create a new view and use that instead and it should work. So I'm basically looking to swap local:NormalDetailView with local:SnappedDetailView
Originally I thought about having both the ListView and GridView in there at the same time and adjusting the visibility based on snapped mode. But I had doubts about the performance about this technique.
Lastly, this is a LayoutAwarePage so I do have all that XAML stuff at the bottom about VisualStateManager.VisualStateGroups etc.
<GridView x:Name="GalleryGridView"ItemsSource="{Binding ListOfItems}">
<GridView.ItemTemplate>
<DataTemplate>
<local:NormalDetailView VerticalAlignment="Center" Width="250" Height="250" DataContext="{Binding}"/>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>

The performance is just fine if you use both a gridview and a listview, and adjust visibility depending on view state. This is exactly what the "split-application" template in Visual Studio does.
Just generate an app based on this template and take a look at ItemsPage.xaml and ItemsPage.xaml.cs. The other templates may also do this, but I haven't used them so I don't know for sure.

Related

How can I design a region settings like this in WPF

Till now I have a combo-box control which displays all the available region language in the UI as a combo-box items.
its in WPF and MVVM
<ComboBox
x:Name="cbLanguage"
Grid.Row="1"
Height="30"
Width="200"
HorizontalAlignment="Center"
VerticalAlignment="Top"
ItemsSource="{Binding LocalLanguages,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
SelectedIndex="0">
But I saw this window and thought this looks much more legant and modern.
Can I do similar kind of window in WPF.
I tried to change the Combobox with list-box, List-view but no result.
Any help if there is any control in WPF which can do this.
This solves many problem specially if the combo box have more than 10 items user has to scroll through the all and then select the last index. But in this way user can select any locals as all are displayed in the UI. Even user can have the option to display alphabetically.
arraging items in 3 columns can be achieved by using UniformGrid as ItemsPanel
<ComboBox.ItemsPanel>
<ItemsPanelTemplate >
<UniformGrid Columns="3"/>
</ItemsPanelTemplate>
</ComboBox.ItemsPanel>
modify ItemTemplate to change items apperance and have green color for selected item
i think it is necessary to modify ComboBox template to have custom header and footer in a dropDown (Edit Template-Edit a Copy in Visual Studio designer)
In WPF combobox is basically a Popup when the toggle button is pressed.
You could implement your own popup or you could have a look at the template of the ComboBox. Here is a link to ComboBox template

Dynamic WPF form creation approaches

I'm about to create a dynamic WPF UI form from DataTable data. The screens would be fairly complex. They would contain textboxes, groupboxes, checkboxes, buttons, datagrids etc. Some of them visible, some hooked up event handlers and thing like that.
What approach of creating those dynamic screens would you choose considering performance impact and complexity requirements to write and maintain source code. Please note that this code will run a LOT so it must be efficient and blazing fast. I'm considering these options:
Create Controls in code, assemble them to a tree and use the tree (Grid control) as a root element for a WPF form.
1.a) Create a XAML via XAMLReader from that screen object tree and Load it via XAMLReader inside WPF Form. Creating XAML would seem redundant to me since I can use the built tree as a Content for WPF form directly.
Use XMLDocument class to create tags, obejcts and their atributes. Create a XAMLlike that and then load that XAML in WPF form.
Thanks,
Michal
Consider displaying your form in a listview and creating a DataTemplate for each of your form fields textboxes, groupboxes, checkboxes, buttons, datagrids etc.
<ListBox ItemsSource="{Binding DataFormFields}"
<DataTemplate DataType="YourTextClass">
<StackPanel>
<TextBlock Text="{Binding LabelText}" />
<TextBox Text="{Binding ValueText}" />
</StackPanel>
</DataTemplate>
<DataTemplate DataType="YourCheckClass">
<StackPanel>
<CheckBox Content="{Binding LabelText}"
IsChecked="{Binding Checked}"/>
</StackPanel>
</DataTemplate>
For more on DataTemplates see
https://learn.microsoft.com/en-us/dotnet/framework/wpf/data/data-templating-overview
Each data template should be associated with a one of your form fields classes, using the DataType attribute, this will cause the listbox to automatically use the correct DataTemplate.
For more details:
https://learn.microsoft.com/en-us/dotnet/api/system.windows.datatemplate.datatype?view=netframework-4.7.2

GridView SelectedItem indicator not present on Windows Phone Xaml

on Windows 8.1 below code indicates the selected item of GridView. But on Windows Phone Xaml same code doesn't work like that. There isn't any visual indicator for selected item at all.(or i couldn't get it to work) How can i make it work like this on Windows Phone App too?
<GridView
x:Name="productColorChoices"
SelectionMode="Single"
ItemTemplate="{StaticResource productColorChoice_ItemTemplate}">
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid
Orientation="Horizontal" />
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
If you go look at the GridViewItem default style template you'll see towards the bottom you have these objects in there;
SelectedBorder
SelectedCheckMarkOuter
SelectedCheckMark
SelectedEarmark
Which is what makes up the visuals for that selected outline/checkmark thingy on the GridView items. They all get shown according to the VisualState for Selected
Now, if you go and look at the phone's default style template for the GridViewItem's (which I couldn't find the default one for with a quick google search and I don't have a phone project open to go dig through) then you can compare. If these types of elements don't exist in the phone templates then you can go add them the same way using pretty much the same objects and the same storyboards in the same VisualState.
Hope this helps, cheers.

Dynamic Panel of Buttons WPF C# Common Use

I am trying to find a best or common practice for creating a table of buttons from a database list.
For my use I am creating more of a Point of Sale type screen. Where I want the categories to load as buttons on the entry screen. The buttons would have a simple task of showing a screen of more dynamically created buttons of the actual items. Those buttons would add the items to, lets call it, a ticket.
The solutions I found were few. I am also trying to code this so others can pick it up fairly quickly. I am extremely rusty and only code once in a while. So I try to follow common ways of doing it. I had some ideas but the code becomes hard to read, mostly because of me.
I saw the below link but was not sure if a ListBox was a good container for this.
Dynamic filling WrapPanel buttons from DB, setting the event handlers
I am sure a wrappenel is what I would have to use, but do I put it in a container or use it directly. Do I put it in Xaml or code it all, for issues like spacing between buttons? I think I am overthinking it and need to skip for a little bit.
Thank you,
It sounds like you want an ItemsControl, bound to your categories, with a WrapPanel as the ItemsPanel. The Button would go in the ItemTemplate.
<ItemsControl ItemsSource="{Binding CategoriesFromDatabase}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Button Content="{Binding}"
Command="{Binding RelativeSource={RelativeSource AncestorType=ItemsControl},Path=DataContext.AddToTicketCommand}"
CommandParameter="{Binding}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
Here I assumed that your view model has properties "CategoriesFromDatabase" (an IEnumerable that you populate from the database), and an ICommand "AddtoTicketCommand" which takes the category as a parameter.

C# wpf - Adding to xaml file during execution

This is what my main program GUI will look like, what I am attempting to do, is to create a reminder application in C# using wpf.
I am going to use a scroll viewer which is going to be displaying the data to the user, namely the reminders they currently have.
Each time the user adds a reminder, it will add this:
What I am wanting to do is that, when ever the user add's a new reminder, there will be a new set of data added to the scrollviewer.
What would be the best way of achieving this?
Am I able to hold the xaml data and add it during execution?
Thanks for the help
What you want to do can be accomplished not by dynamic Xaml, but by the use of a templated control which can accept dynamic data. For example you wouldn't consider using a listbox for your labels because you are not showing the data in a list right?
But a listbox is just a conveyor belt for what you want to achive. Say you want more than a label, how about three labels. Via binding to a proper structure you can get what is needed.
Here is an example
<ListBox ItemsSource="{Binding myReminders }">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Path=ReminderName}" />
<TextBlock Text="{Binding Path=Description}"/>
<TextBlock Text="{Binding Path=Priority}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Once that is bound to a list of my reminder data objects (which the list can dynamically change), we have the ability to show the reminders in any format we want. One just uses the above to style it appropriately. (Check out WPF's Templating Overview for a great example).
The use of templates is done in other controls, so if the listbox is not to your liking, look into other templated controls.

Categories

Resources