I would like to create panels with detailed information regarding an item (including a thumbnail image on the left hand side) and then add these to a scrollable list. Much like how iTunes on the iPhone displays the lists of applications available.
I have done some searching but have thus far been unable to find any assistance.
Does anyone have any ideas or links to samples they would like to share with me.
Thanks in advance,
Rob
In sum, the following creates a series of panels within a container that scroll in and out of view using a vertical scroll bar.
You did not list ASP.NET in your tags, so I assume this is Windows form-based, not web based. I'll get you started:
Create a panel called GrandChildPanel. Inside it, put an image box on the left side and labels with the information you want to display next to the image. This panel will be duplicated for every item (i.e., iTunes song).
Put that panel inside another, equal-width, equal-height panel called ChildPanel.
Create another panel called ParentPanel and set its width to the size of the other panels plus enough room for a vertical scroll bar. Set the height equal to however tall you want the scrollable area to be.
Put ChildPanel in the top-right corner of ParentPanel and add a vertical scroll bar to the far right edge of ParentPanel. Set the scroll bar's height to takeup the entire height of ParentPanel.
You probably want to add a border to ParentPanel to show its boundaries.
You also probably want to add a 1 or 2 pixel line across the bottom of your GrandChildPanel to show where the panel ends.
That's the setup. Here are the requirements for your code: Each time you 'add an item to the list' (e.g., every song in your iTunes list), you do the following:
Clone the GrandChildPanel.
Assign the clone to be a child of the ChildPanel.
Set the clone's Top to be equal to the previous clone's Top plus its Height.
Set ChildPanel's Height equal to any given GrandChildPanel's height multiplied by the number of clones.
Set the scroll bar's maximum value to equal ChildPanel's height.
Now, all you have to do to make this scrollable is perform the following on the scrolling or changing events of the vertical scroll bar: Set ChildPanel's Top to be equal to the verticle scroll bar's value ("position") multiplied by -1.
Related
I'm currently working with a DevExpress ChartControl with several panes stacked vertically on top of each other. The panes can individually be shown or hidden at runtime, but their contents won't change after they're created. I'd like to remove all space between the panes so that the border of each is totally flush with the border of the pane above/below it.
I've already used the following code to set the PaneDistance to 0, which normally would do exactly what I'm looking for:
XYDiagram diagram = chartControl1.Diagram as XYDiagram;
diagram.PaneDistance = 0;
However, the problem I'm running into, visible in the screenshow below, is that the labels on my y axes can sometimes extend vertically above or below the edge of the pane itself, which forces there to be space between my panes.
The first two panes have no space between them at all, which is exactly what I want, but the problem can be seen on the bottom whree panes. The "0" label on the second pane extends slightly below the table, so empty space is added to allow it to fit. The bottom two axes both have labels that extend outside their panes, so even more space is being added.
I've tried editing every property of these axes that I can think of, but nothing has been able to remove this blank space. It seems like just getting the outer labels to be pushed up or down so they're inside the pane height should do the trick. Anyone have any ideas on how I can get this working like it should?
Edit: I'll mention that in a different part of this app, I have a different set of panels, rotated and aligned horizontally, with their axis labels doing what I want them to do in the case above:
You can see that the "0" and "300" labels are shifted slightly off-center to fit within their own pane, so they don't extend out and create empty space. I didn't have to touch any code to get that to happen. It could be because these are all instances of the same axis, while the ones that don't do this are different axes, that causes them to play nice in this case?
Edit 2:
Here's what I've got after setting my axis SideMarginsValues to 0 and AlwaysShowZeroLevel to false. Getting closer!
if you can't achieve what you need with DX chart's public properties there is still one trick you can try.
In Browser choose Inspect the chart area (CTRL+SHIFT+I in Chrome) and find the actual chart's element or the parent element and see what classes/ids DX have assigned to them.
Then pick the nearest element class/id and try to play with it's css by assigning negative margins/paddings like:
.dxtcLite.dxtc-top .dxtc-stripContainer {
margin-botton: -2px!important;
}
This is of course a dirty solution but sometimes it's the only one which works.
However, if you don't have any HTML-type margin/padding between chart panes but the blank space is actually a part of the generated chart Image, then probably the only thing you can do is to continue playing with DX chart properties which affect the actual chart image generation.
UPDATE:
Have you tried setting the Range.SideMarginsValue property to 0?
diagram.AxisY.WholeRange.SideMarginsValue = 0;
Another option would be to try to always hide 0-level axis label using
WholeRange.AlwaysShowZeroLevel :
diagram.AxisY.WholeRange.AlwaysShowZeroLevel = false;
or try setting max values for the axis values to exclude border labels:
// depending on possible min/max values for each pane
diagram.AxisY.WholeRange.SetMinMaxValues(5, 35 );
Let me know if anything of the above helps.
I have a C# winforms application that has table layout panel. The panel is set so that there are two columns, with a 75/25 % split. In the larger section is a docked panel that holds some controls, while the smaller section has a docked panel with a single label. We push a wall of text to the label on the right and it is getting jammed up ugly.
I've adjusted the controls on the large section and recovered some space that I want to give over to the label panel. The "Completed" and "Inspected" labels and dropdowns are not in use, and set to invisible currently. I used designer to adjust the split on the table layout panel to be 65/35 %, but the docked panel and the label didn't change position on the layout.
What I want to happen is for the table layout panel to have a larger portion of the split given over to the label and the label to fill the new space when text is set to it.
The results of my efforts haven't gone very far. I adjusted the split %, but the label looks unchanged. It seems to be the exact same size it was before making changes. It looks like the label maintained the same position as well, stuck to the right hand border of the panel. The label definately isn't extending past where it originally ended/started with the 75/25 split.
The sub panel and the label are set up to fill and anchor top/left. The panel is docked to the table layout panel. I was under the impression that the docking and filling would account for the change in the split, but I'm wrong about that I guess. I feel like this whole problem has some root in these settings, but my tinkering with them hasn't changed anything that I can tell.
Following the instructions provided by LarsTech, I adjusted the settings on the layout panel to be absolute pixel value on the left hand side and 100% on the right. I then set the panel anchor to top, right. I set the label itself to dock = fill. The label is now stretching across the entire area covered by the blue arrow.
Thanks again. Would give a +1 to your comment if I could.
Excuse me if this is a trivial question to WinForms users, I come from a background in game programming, and the WinForms API is very different than I'm used to for doing the UI in games, and this is my first time with WinForms.
I have a UserControl, attached to that is a Panel, attached to that panel is a TableLayoutPanel with many rows and 1 column, and in each of those rows is a Panel that displays an image. Hierarchy looks like this:
UserControl
|- Panel (I use this one to scroll the child of this)
|- TableLayoutPanel (many rows, 1 column, one panel per row)
|- Panel1 (contains an image)
|- Panel2 (contains an image)
...
|- PanelN (contains an image)
Each of the rows, as well as the panel within them, is created at runtime.
Now, since that TableLayoutPanel is usually too tall to fit on one screen, I have its parent panel set up to scroll.
So here is my problem: I need to be able to search all of the leaf panels (Panel1 - PanelN), and find the ones currently showing on the screen. I am trying to do this by taking each Panel's location (Panel1.Location), and seeing which y-coordinate is closest to 0, and using that as my starting point. The problem is that I can't seem to find the right combination of calls to PointToScreen, RectangleToClient, RectangleToScreen, etc to get useful data. Regardless of which Point/Rectangle I get from those calls, they either have y-values that are constant (i.e. defined relative to their parent TableLayoutPanel, not moving) or they do move with the scroll bar, but there is some constant added based on either the window's position on the screen or its position relative to some other parent elements that are above the UserControl.
What calls do I need to make to get the position of Panel1 to return (x, 0) when the scroll bar (on Panel) is all the way at the top of the page, and start returning negative numbers (x, y < 0) as the user scrolls down?
I've looked at these stackoverflow questions (and quite a few other resources), but the code in them did not help with my problem:
Getting The Location Of A Control Relative To The Entire Screen? ,
c# absolute position of control on screen ,
How to get the Screen position of a control inside a group box control?
Try Panel1.Top + TableLayout1.Top - Panel.VerticalScroll.Value
I'm using WinForms and C#.
The application I am developing draws rows of rectangles (using g.DrawRectangle()) inside of a panel. The panel can hold 6 rectangles in width (I don't want to have horizontal scrolling). I control this within the application by counting the rectangles in the row, and then adding to the y value after the sixth rectangle.
Vertically, I want to be able to add infinite rectangles and scroll down to see them. Right now, the rectangles are being added, but the Panel doesn't scroll (they are just added off screen).
Is there a way to add a vertical scrollbar? I have tried setting the AutoScroll property to true, but that doesn't do anything.
The problem is that you are using graphics to draw on the panel. These are not controls, so they don't cause the panel to grow. you should create two panels - PanelA contains PanelB. PanelA has AutoScroll=true, but you draw on PanelB. As you draw, you also set the height of PanelB, so that when it gets bigger than PanelA, PanelA gets a scroll bar.
I have this:
Each list is its own WrapPanel and they are all on another WrapPanel which is in a ScrollViewer. If I don't set the height myself for the main WrapPanel it assumes I want the WrapPanel as high as it can go giving me only one column whereas I want as many columns as needed to fill the window.
If I set the Width and Height of the WrapPanel that holds everything to fixed numbers, but I want it to change when the user resizes the window.
In your example screen shot and description I see a tab control whose anchor is set to Top, Left, Bottom, and Right. The tab page with AutoScroll set to true. Within the tab page I see a FlowLayoutPanel. The FlowLayoutPanel has its AutoSize property set to true. I also see a set of other panels/user controls each of which contains a title and a series of check boxes.
You can`t achieve this with standard controls. You can try to create your own custom WrapPanel implementation. But, actually, looking at original WrapPanel sources I think this will be quite tricky. You see, what you want, is basically to measure how many columns can fit in the current window, while every element in column can be of any size. The way I see that algorithm, it will require N*N iterations to get the final result. So you may have problems with performance.