I am using C#, Silverlight, WP7.
I have been going over Metro Grid Helper (see this link) as I'm also interested in doing an overlay on an existing app. Basically I want to highlight an area, which would add a Rectangle on the overlay.
The difference is that I would like the overlay to scroll with the page, so that the Rectangle would stay in place over an item (like a TextBlock) underneath. And I am confused as to how to do it.
Any suggestions as to what methods or properties or events I should look into for this?
Thanks in advance.
As I am still learning how everything works in Silverlight, I figured this one out today.
The MetroGridHelper class that is linked in the original question adds the overlay objects to be children of the main Grid of the page. This means that no matter what the other controls are for the application (like a Pivot, Panorama, or ScrollViewer), the overlay objects will not move.
Thus, to get the objects to scroll (or swipe with a Pivot or Panorama), the objects need to be the children of the control. So inside the main Grid, look for the control and make that the parent of your objects.
Related
I'm trying to make Xamarin forms application, in which the data should look like this.
However, it can be seen that the height and width of the view are large and I need to scroll the page both horizontally and vertically. So, when I scroll only the data portion should move while the A and B axes stay constant. If I move to column B6 then the view should be as shown below
and from this point if I move row A5 the view should be as shown below.
I'm quite new to xamarin forms or any other android development programming. At this point, I'm just trying to know what kind of search terms that I should use where I can find some documentation related to make such kind of view in my application. I guess a simple idea can be just using a scrollbar but I need my axes points visible all the time even if I scroll far right or far below.
Any suggestions?
Thank you!
To your question, you can search with scrollview, it is a layout that's capable of scrolling its content. You can set the orientation of your scrollview as "both" so it can scroll both horizontally and vertically.
But it can only have one content to scroll. It means scrollView objects should not be nested with other controls that provide scrolling, such as CollectionView, ListView, and WebView. For more information, you can refer to https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/scrollview
I am trying to make a WPF application in which there is a drag able toolbar on the screen through which user can select different type of tools and use it on canvas. Also can someone tell me how to make a transparent canvas. A good example would be from this picture in which there is drag able toolbar on right side of the picture. And the user can also work on any window he wants. I am new to WPF and I am trying to find a solution to my problem for quite a while now. Can someone guide me in the right direction...
Background DP default value is null. When a Background is set to null the displayed Color is White and mouse interactions don't work. You need to set Canvas's, ListBox's and ListBoxItem's Background to Transparent to see the Background of the Parent Control
<Canvas Background="Transparent"/>
Rather than a toolbar, think of that as a window.
I would take a look at avalondock.
A transparent canvas:
<Canvas Background="Transparent"
As an aside, this is a couple of steps on from wpf beginner level.
If you take a look at this:
https://imgur.com/4n7vH8k
The user is designing a game scenario. They drag units out the panel on the left ( it's a treeview ) onto the canvas on the right. Only this is not just a plain canvas, it's an itemscontrol with a canvas as the itemspresenter. That allows me to template out the units from a collection of unit view models. It's using the mvvm pattern.
If you've not come across this technique it's a bit strange. Here's a couple of samples to take a look at which templates out different viewmodels into different UI objects. https://1drv.ms/u/s!AmPvL3r385QhgooJ94uO6PopIDs4lQ
https://1drv.ms/u/s!AmPvL3r385QhgooLcGrZOSwFswa-Dg
The datatype is used to decide what you get in the view for what viewmodel.
You have a bit of a complication in that you decided you want a dockable panel usable in multiple windows. Maybe that's not a must have.
Drag drop in my app isn't actually drag drop and relies on an odd aspect of a canvas. They don't clip, so you can add something to a canvas but have it positioned off the canvas.
As you start dragging a unit, it's viewmodel is added to the collection bound to my units itemscontrol. That templates it into the canvas as a piece. I work out the location compared to the canvas, so it'll have a negative X aspect which I bind to Canvas.Left.
Each unit is inside a thumb. A thumb is the rectangle you drag up and down on or side to side on a slider. They are designed for dragging. This way dragging is smooth and I can easily have a unit under the cursor that's being dragged.
I have a panel, which I add controls programmatically to it. I want each control stay in a far from other controls and not stay on top of them.
for this purpose I can calculate a position for each control based on Panel's size, but it seems a bit odd.
Is there a way to make controls be added in a line and when it ended they be added in another line?
You can use a FlowLayoutPanel to achieve what you're describing. It's under Containers in the ToolBox. Set the direction to horizontal and it will flow from left to right, and wrap when it needs to.
I believe the WrapPanel class does what you're describing in WPF. Or the FlowLayoutPanel in WinForms.
You have a few options. You can use one of the containers such as FlowLayoutPanel or TableLayoutPanel. You can also nest them in each other. And you have to set the Margin property for each control you add to the containers.
Sadly the Windows Forms technology lacks on this part a little, while WPF has a very rich layout system. Even somethings like Margin doesn't always work as expected.
Basically, I have a SemanticZoom control with a GridView inside it, and the GridView has a custom control inside it, but for simplicity, let's assume it's a simple red Border. The problem is that I'm trying to handle the Border's manipulation when scaling (set ManipulationMode to Scale) so that I can know when the user does a pinch out gesture and "Zoom In" into the Border (which is really another page), but by handling the Manipulation, I lose the ability to (1) use the SemanticZoom and (2) Scrolling the grid.
If you have used the Windows 8 photo app, you'll notice that they implement this feature somehow. If you pinch in into an image, the Page will go into SemanticZoom, but if you pinch out it will go into full screen mode. I want similar functionality, but I don't know how to achieve it.
Any ideas?
Thanks in advance.
I will use 2 SemanticZoom controls to achieve Photo App Effect.
First of all, here's some concept art for how this custom list control must look:
http://img816.imageshack.us/img816/1088/customlistctrl.png
Each list item is fairly complex and turns into an "edit interface" when the mouse hovers over it. I also have PNG image files for every skinning detail of this thing, including the scroll bar.
What is the best approach to get started implementing this? Would I create a custom control and simply render all of this in GDI?
Could I make the list control a transparent clip region with a scroll bar? For the individual list items, would I simply use a textured panel as the backdrop for each item and place existing .NET forms (like combo boxes, buttons, edit fields, etc) as children of that?
I've never had to create something this detailed before.
If you want your control to look exactly like the given picture (which is nice), you will end up drawing much of it, if not all of it, yourself. One possibility is to subclass each control being used and override the OnPaint method to do your custom drawing. This assumes a design where everything in your picture is an individual control.
I myself might make each row a separate UserControl-derived class, perhaps with an internal constructor so users of your control can't create the row directly. Within your SkinnedListRow class (or whatever name), you could have each of the subcontrols. By the looks of things, the row contains three controls that display numbers and one that displays any kind of text.
For the editing portion, derive another UserControl that contains all the controls you picture. Both the display controls and the editing control are owned by the SkinnedListRow from above, so it knows how to load data from one set into another.
You have a good amount of work in front of you, but your idea looks nice. Good luck.