Only display complete items in a stackpanel - c#

I have a slider which consists of grid of:
Scrollviewer
Stackpanel (the stackpanel is located inside the viewer)
The slider has 2 navigation buttons to browse trough the selected items.
But how can i only show complete items? Currently some buttons only get shown in half because there is no more space available. In the final version only 5 buttons should be shown at once. But if a certain event is fired more buttons will be visible for.
For example 1-5 are visible. If another button pops up only 2-6 should be visible.
The buttons inside the slider have to be created dynamically.
Does it make sense to stick with stack panel? Cause at the moment the buttons are static.
EDIT: When adding buttons dynamicly to the stackpanel how exactly does this work for already custom made buttons? I can add a normal button just fine but i wish to add the buttons already made below.

I believe the VirtualizingStackPanel (with virtualisation turned on as it is by default) can only perform item-based scrolling (as opposed to pixel-based scrolling). It might be worth trying swapping the StackPanel for a VirtualizingStackPanel to see if that fixes your problem.

Related

How to bring an element inside a list view item to the front of the entire app?

Using UWP XAML, I am trying to recreate this textbox UX from Postman whereby it pops up above all other elements in the app to display the full text: https://streamable.com/avrixo. I've almost fully recreated this UX, but I am having trouble bringing the textbox to the "front" of the app while the textbox is inside a listview.
What I have tried:
I have tried creating a UserControl for a custom text box with Canvas as its parent. Like this:
<Canvas>
<TextBox/>
</Canvas
I added some event handling to change the text wrapping and the Canvas.Zindex attached property of the textbox when the user focuses on it (I've tried setting the z-index to 1, 10, 100, and 1000000). However, I found that as the textbox expands vertically, it remains "behind" the listview item below it no matter what z-index I give it.
How can I bring the textbox inside a listview item to the "front" of the UI?
I don't think your problem is with z-index (per say) in this case. The problem here in the ListView is that each ListViewItem has it's own bounds, so the TextBox is being clipped by the bounding box of the item. You can double-check the bounding areas with the Visual Tree tools at least to confirm that's the issue.
If you don't want the ListViewItem to expand in size to match, I can see two options. When the user clicks to edit, you put a 'fake' TextBox (bound to the original in the ListView or the data item) either in 1) a Pop-up that you display or 2) in an overlay that's part of your page's XAML that has the textbox.
You can grab the selection state and cursor positions and such from the original textbox, and move focus to the new one and mirror that same state.
That's the approach I think I'd take.

Custom Scrolling with ListView

I've been tasked at work with creating a UserControl containing a ListView and ComboBox's for sorting the ListView data. Sorting with the Combobox's s the easy part; the part with which I'm having difficulty is implementing a method of scrolling. In the end, the control should have an Excel-like feel to it. However, sometimes the ListView is too tall or wide for where it is placed. Therefore, there two be two scrollbars somewhere on the control. One vertically moves of the ListView only, and the other moves both the ListView and ComboBox filters horizontally.
Please note in the image above that the ComboBox's do adjust themselves according to column width, but the code for that is not enabled at the moment.
What I've tried: In the control, the filter boxes are in their own panel, and the ListView has had its own panel at times. I've tried using various combinations of the HScroll/VScroll and HorizontalScroll/VerticalScroll properties and the native function ShowScrollBar() for all the controls, but nothing has worked. The only way I've gotten scrollbars to appear is by settings AutoScroll (Scrollable for the ListView) to true. Of course, the scroll bars come in pairs and work only on the same control. I also attempted to programmatically move the scroll bars, but I haven't been able to accomplish that, either.
I've got to be doing something wrong, but I'm not sure what it is. Any help is appreciated!
I think I'd go for a different solution.
If you put the ComboBoxes in a AutoSrcoll panel with the same Anchors as the ListView you would give your users the freedom to scroll the two independently.
Yes, a ScrollBar would appear and take space but I would still happily sell that as a feature, not a bug ;-)
As for handling the Scroll event of a ListView: It is hidden and you'll have to subclass it to get access to it. See here

c# How to make a button ignore panel vertical scrollbar?

I have a panel on which I placed some ComboBoxes , 2 Buttons and a Scrollbar. I want my buttons to stay where they are, while ComboBoxes will follow the Scrollbar. So far, I've found one solution, on my first Panel I added another one, where I placed my buttons but it's kind of weird. Is there any other solution?
You need to place the buttons outside the Panel; right below it. You can then set their Anchor property as well to ensure they move when the Form is resized. That being said, you'll want to set the Anchor property of the Panel appropriately as well.

How VerticalOffset changes when Scrollable height changes while having list inside a list

I am making a WP7 app which has a Listbox of UserControls. Each UserControl has an ItemsControl and Button(for getting more results). On click of the button the ItemsControl items will be increased by 5 or 10.
Now on clicking on the GetMore button of any of the usercontrols except the first or last, there will be an increase in Scrollable height(Total height of the listbox) of the ListBox but the VerticalOffset(position of scrollbar from top) of the ListBox remains same. Now the problem I am facing is that the Vertical Offset is not absolute but relative to Scrollable Height. So the content being viewed till then will be changed basing on the new value of ScollableHeight.
I want to know the relation between them, so that I can do some math and set the VerticalOffset value.
I have added some dependency properties on VerticalOffset and ScrollableHeight through which I can get the events when any of them is changed. Trying to use ScrollIntoView for readjusting the Vertical Offset
Any suggestions or corrections are highly appreciated.
I am not able to find the calculation. But what can be done is listbox can be replaced by a scrollviewer which has itemsControl inside it. But the disadvantage of this is virtualisation is disabled, so will need to check on this.
But, overall this is going to give a bad experience on using such a UserControl in Listbox. So using templated list box given in WP7 toolkit is an option but it is gonna hang a bit since ListBox is not optimized for multi templated virtualization. So I started showing writing listbox item template in such a way it contains all the possible layouts which will enabled from a condition.

Silverlight Scrolling Tab Control

I am wanting to create a sivlerlight tab control where the tabs remain on a single line and scroll buttons will allow me to scroll left or right through the tabs. Below is a link to a control that can be purchased but I would like to write my own and share it with the community. I know I can create a inherited class and style with buttons for the tab control. I guess I am confused on how to keep the tabs on one line and scroll the tabs so only half of a tab would be shown. Can you all help with this? If I way off base please correct my direction.
Sample tab control
Recently I have created the TabControl in which the tabs are situated on the single line.
I have written the blog post where I've explained some details.
Also you can download the project directly here.
My first instinct would be to create a control that has a ScrollViewer with a WrapPanel inside it (from the Silverlight Toolkit) that is flowing horizontally. Then you can add the tab buttons to the flow panel and you should have the scroll behaviour.
Of course, if you don't want a scroll bar but instead want buttons, you can do the same thing but hide the scroll bars, then embed the whole thing in a Grid with three columns. Have the ScrollViewer sit in column 0 with a columnspan of 3 and then add a button to columns 0 and 2 that you can show and hide when the mouse rolls over that cell of the grid. You could then somehow scroll the viewer when the buttons are pressed.

Categories