So i am trying to make an accordion content holder for an uwp application. I can't find anything resembling what i want to achive in the documentation. Is this someting i need to build from scratch using stackpanels and codebehiend ect ect, or are there tools I can use within the libary which I havent found yet ?
Here Is an example of what i want. When the users clicks on a vaccine name, a content box containg information about that vaccine will dropdown. And if it is click while expanded, it will slide back up and only display the name again. An accordion.
Any suggestions, tutorials, articles on the subject will be much appreciated. Thanks in advance.
There is UWP Community Toolkit available that has an expander control that you may be able to utilize. You can get the code sample from the Windows Store and the source code is on github.
https://blogs.windows.com/buildingapps/2016/08/17/introducing-the-uwp-community-toolkit/#v6cSIzET7QwQOb8O.97
I believe from the answer that you know how to make a ListView using DataTemplate. If not search the documentation for this.
So I believe that the most important piece of the question is about the expanding.
First in your DataTemplate bind Height to your DataModel for example like this:
<Grid Height="{x:Bind Item.Height, Mode = OneWay}">...</Grid>
Then place Clicked (or Tapped if its control doesn't support Clicked) event on that arrow, and handle it in the code like this (Tapped may require different arguments but they'll appear automatically anyway):
Arrow_Clicked(object sender, RoutedEventArgs e)
{
var item = (sender as Button).DataSource as Item;
if (item.Height == 80)
item.Height = 200;
else
item.Height = 80;
}
Related
I have a silverlight app where there is a telerik radtreeview with checkboxes. The user selects stuff and when the user wants to edit it's selection i need to pre-populate the tree with the previously saved selection.
I found out that I can bind the checkboxes to my viewmodel. But if I choose that scenario I don't use the "built in" checkboxes and lose the tristate logic (autoselecting siblings when selecting a parent and such)
So I am experimenting with trying to get the radtreeviewitem objects from the radtreeview.items collection
http://www.telerik.com/help/silverlight/radtreeview-how-to-iterate-through-treeviewitems.html
The problem is that the radtreeviewitems are only generated when a node is expanded by a user in the ui. So not all items I want to iterate through are present after the control is databound.
I have not found a good way to force the ui to build all the radtreeviewitems so I can iterate through them and set my preselection. I found the links below but it only seems to work with the root node, not the siblings.
WPF: control.ItemContainerGenerator.Status is NotStarted. How do I tell it to start now?
Would you guys also consider rebuilding the "tristate-mode" into your viewmodel logic "dirty"?
How would you go about preselecting checkboxitems in the radtreeview?
This is how I do it :
public static void CheckAllTreeItemsAuto(RadTreeView tree)
{
tree.ItemContainerGenerator.StatusChanged += (s, e) =>
{
if ((s as Telerik.Windows.Controls.ItemContainerGenerator).Status == Telerik.Windows.Controls.Primitives.GeneratorStatus.ContainersGenerated)
{
RadTreeViewItem item = (RadTreeViewItem)tree.ItemContainerGenerator.ContainerFromIndex(0);
while (item != null)
{
item.IsChecked = true;
item = item.NextItem;
}
}
};
}
I didn't experience your problem with the items not generated at the start. (I don't know how you generate your RadTreeView).
When working with the RadTreeView control you need to have in mind that the built-in tri-state logic is designed to work with declaratively defined control and items, only. This means that using this feature in MVVM scenarios will not work as expected.
Since Telerik is aware of that limitation they provided the community with an article demonstrating how developers can use the tri-state logic of a native CheckBox control in MVVM scenarios. You can find the article in their documentation. Also, at the end of the article you can find a link leading to their CodeLibrary where you can download ready to run project demonstrating the described approach.
I hope this information will help you.
There is a similar question like mine here in Stackoverflow but it only explains how to change it in XAML. I want to know how can I change it in code.
Here is a image that shows how I do it in XAML using Blend:
Link for full size: https://snag.gy/4Skk4.jpg
Basically I want to change the background of a button's pressed state in C# but I can't seem to find any examples on the Internet. It must be in code because sometimes the image of the button will change therefore the button's pressed image must change as well.
The following code is just to change the image of the button and it's just the start.
image.ImageSource = new System.Windows.Media.Imaging.BitmapImage(new Uri(#"images/Button-warning-icon.png", UriKind.Relative));
image.Stretch = Stretch.Uniform;
buttonWarnings.Background = image;
If I understand you correctly, you are trying to change the appearance of the Button control in a "pressed" visual state.
I'm not near my dev computer to try it out, but to "unblock you" I'll give a direction.
First, as you noticed in your Blend screenshot, each visual state is represented with a Storyboard, which defines how various properties change. In your case, you're looking to change Background property.
The VisualStateGroups and their states are defined by the control. You can override them when you re-template the control. So, retemplate the button control using Blend with "Edit Template"->"Edit Copy".
Then, in code, you should be able to do the following:
1) Get visual states (this would not work unless you re-template the control, AFAIK)
var visualStateGroups = VisualStateManager.GetVisualStateGroups(buttonWarnings);
2) Get the VisualStateGroup of "CommonStates" from the visualStateGroups
collection
var commonStatesGroup = visualStateGroups.Find((g) => ((VisualStateGroup)g).Name == "CommonStates") as VisualStateGroup;
3) Get the "Pressed" VisualState:
var pressedVisualState = commonStatesGroup.Find((vs) => ((VisualState)vs).Name == "Pressed") as VisualState;
4) Change the storyboard of that state
pressedVisualState.Storyboard = newStoryboardWithCustomImageBackgroundProperty;
(Disclaimer: I'm not near in a computer to try it now - it's all in theory)
There are many examples to be found on the internet!
Take a look at some:
http://mobile.dzone.com/articles/windows-phone-buttonimage
http://loekvandenouweland.com/index.php/2011/01/windows-phone-image-button/
Actually its quite simple,
While in button pressed state....see part 3 in the image you uploaded above.
Above all the colors there is a row containing 5 icons.
Click on 4th icon.
it will show you option to choose image as background.
Ok, I have the following problem:
I would like to scroll an overflowing ListBox up and down.
I would like to do it programatically in a custom control inheriting from ListBox. I've seen and tested things such as scrollIntoView. However I would like to have a scrolling similar to what you can have when using the mouse's wheel.
I don't want to have the mouse involved at all (I'm developing for the Kinect, and since there are 2 cursors, I don't want to use the Mouse event args)
a google search didn't turn up much: I've read plenty of thread on how to scroll in code behind using scrollIntoView, or putting a scrollbar and such.
I think this will involve two steps:
Find the scrollViewer control inside listBox template
Perform the actual scrolling in that scrollViewer
For the first step implementation please take a look here. Here is the code snippet extracted from there:
this.Loaded += MainWindow_Loaded;
void MainWindow_Loaded(object sender, RoutedEventArgs e)
{
var scrollViewer = listbox.Template.FindName("Scroller", listbox);
}
And for the second step you should use one of the methods from here, LineDown or PageDown probably.
P.S.: I haven't tested this approach at all since I do not have VS installed so feel free to add the needed code here.
Hi there is a control in asp.net called SiteMapPath i need something similar in WPF to help users navigate back and forth through the application pages ...
does any one know about any third party control or built in features that can help me implement this feature or should i start from scratch
Being able to display journal history can do the trick too
I don't know of any WPF controls that work like the SiteMapPath. You could use a menu or a tab control to load different views onto the page and define the menus/tabs in xml. Below are a couple of links which may help spur you on to some ideas.
WPF XML DataBinding
Bind to XLinq
For Breadcrumbs you may be interested in
code project
stack overflow
Ok i created my own breadcrumb for wpf ...
First of all since all the navigation in my application were based on wpf NavigationService i used the BackStack property of the Frame
var x = Frame.BackStack.Cast<JournalEntry>().Select((page) => page).ToList();
Now it is just a matter of binding a listbox or whatever control you want to the Name property of the List above and in my case since i just needed to keep track of previous pages i added this code to the SelectionChanged event of the listbox bound to above List
void listBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
int i = (sender as ListBox).Items.Count - (sender as ListBox).SelectedIndex;
for (; i > 0 && (sender as ListBox).SelectedIndex != -1; i--)
Frame.NavigationService.GoBack();
}
I've seen two threads here about TDI & C#. Both of them didn't really answer the questions I have ...
Since TDIs are pretty much like a standard nowadays, I can hardly imagine, that I have to buy a special control (like AvalonDock or SandDock).
This must be possible with built in the tab-control(?) somehow! I don't need special features like dock- and draggable tabitems. Just open every form in a new tab. Thats it.
Like putting every forms content controls into user controls and by request (button, menu click ...) add a new tab and put the corresponding user control on it ... something like this.
How would you do it? This can't be THAT complicated (even for me) or am I missing something?!
thanks a lot!
Maybe Josh Smith's article on MVVM can give you an idea how to design such user interface. Example being built there is kinda tabbed document interface so you can use it as a starting block.
It's not that hard. It seems hard because there are a lot of different ways to do it.
Try this:
<TabControl x:Name="documentArea"/>
Handler for AddForm button:
private void AddFormClick(object sender, RoutedEventArgs e)
{
object form = GetNewForm();
documentArea.Items.Add(form);
}
That's it. You have to implement GetNewForm() in one of two ways. Have it return a user control that displays the form.
OR better yet, have it return your document that you want to display. Use a DataTemplate to select the controls to use for displaying this document. This method is going to be more complex to set up.