Basically, I have a lot of xaml code that uses margins, and is base on the 1366x768 screen size. Unfortunately, my monitor is 1920x1080, so when it launches, my UI seems a little bit squished and the data is pushed to the wrong place. Is there a way to make my program launch in 1366x768 and not be allowed to change screen size?
Also maybe, if I do go 1080p, it still looks good - like, some of my ui elements just move across the page, and all my combo boxes just get huge
Does this all make sense? If not, just say :)
To answer your first question, all you need to do is set the "ResizeMode" property of the Window:
<Window x:Class="TestWPF.MainWindow"
....
Title="MainWindow"
ResizeMode="NoResize"
Height="1366" Width="768">
Regarding the second part of your question. I have a feeling that perhaps you're not quite using the available ways to lay out controls in WPF properly. UI Elements shouldn't move across the screen if you use Grids, DockPanels, and StackPanels to lay out your controls. I'd recommend you look at some examples. Post your XAML if you want a more specific suggestion regarding this :).
Related
I'm trying to build a timeline-like control for a project, but I have limited experience with WPF, and don't really know where to start. The requirements are fairly simple: I have an ObservableCollection of objects that have a timestamp property, and I need to be able to select one or more of them and drag them back and forth on a "timeline". All of the objects will be rendered the same size since there's no concept of a start/end time. Here is a mockup of what I'm trying to build:
I've spent hours searching for examples or tutorials, but when I search for "timeline" controls most of the results address a completely different problem:
Rather than going with the classic override of the Thumb control, I threw together a quick framework based off your mockup:
ZIP: http://www.mediafire.com/file/fidg8ea88ofoki4/TimelineFramework.zip
VirusTotal: https://www.virustotal.com/en/url/7579b365749d07eb743643ab118de71c7dd09cb03df7a8b28fbf3cec816ff4cc/analysis/1484802709/ and https://www.virustotal.com/en/file/4899aa96234e1e69c4e935f7d692e46789d8b4b7a5afd4c354937ed921986b20/analysis/1484802463/
It's pretty basic in terms of WPF as it's mostly C# with little XAML, so you can probably figure it out real fast and then be on your way to adapting it for your specific needs.
In the demo app, it looks like this:
The blue bands are draggable, with the thick center line representing their true placement and the faded side blue making for a bigger grip to click on. Hovering over a band shows its placement in the Tooltip. Of course, you can restyle and adjust all the visuals to your needs.
i'm fairly new at this so i apologize in advance if i say anything stupid.
I am making a UI in WPF that consists of 8 buttons to open various programs set on my computer. Currently i am trying to get the buttons in the UI to scale based on the detected window size.
The problem i am having is trying to get the calculations done in the C# code to link over to the scale transform option for the buttons in XAML.
I have searched high and low to find a solution but i still cannot find a way to link the value to XAML. Does anyone know of a guide for something like this and should it be done using a converter?
Thanks for any help.
When you need your content to autoscale, put it all into a ViewBox control.
<Window>
<Viewbox>
<Grid x:Name = rootGrid>
</Grid>
</Viewbox>
</Window>
Now everything will magically fill to the window size and scale! Instant awesomeness for your app.
I've created a datagrid and placed it in a spot in a WPF form.
Now what I'm trying to do is have the datagrid change its size keeping the same proportions as its original placement with the WPF window changing size (hopefully that makes sense).
I've tried setting autostretch to true but that hasn't helped.
Got my computer with Visual Studio in my office, so can't test it :) but shouldn't this work if you set the alignments to stretch?
datagridObj.HorizontalAlignment = System.Windows.HorizontalAlignment.Stretch;
datagridObj.VerticalAlignment = System.Windows.VerticalAlignment.Stretch;
Sure it makes sense, but it sounds like you don't really understand how the WPF layout system works, and unless you do it will be really painful going forward. The short story is, you need to have an appropriate container - I recommend Grid - and have your DataGrid placed in that container. Then you can set margins and so on for the DataGrid to place it however you like, and provided it has its Width and Height set to Auto, it will keep with its parent container.
Now if you have several other controls in the picture, of course it's a bit more involved, but I still recommend keeping with Grids and splitting them into however many rows and columns you require, then setting the appropriate values for their Height/Width respectively - you can make some columns fixed in width, or a multiple of other column, or leave them as Auto and they will take up the remainder of the space.
The topic is much more involved of course, but you can find a quick primer on MSDN: http://msdn.microsoft.com/en-us/library/ms745058.aspx
If you'll remember just one thing, it should be this: Grids represent fluid layouts in WPF, use them as much as possible as opposed to Canvases. Of course StackPanel and DockPanel etc. have their own specific uses.
P.S. The visual studio designer makes a bit of mess of things usually, by setting margins and so on to make the drag and drop more intuitive, you should pay close attention to the properties it modifies and see if you're not better off positioning things manually by modifying the XAML (you usually are) once you sketched the layout out.
just as example
<Window x:Class=""
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<DataGrid Margin="162,57,141,54"/>
</Grid>
</Window>
by default a DataGrid is
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
so you only need a Margin like Arno Saxena told you
How can it be done? If there are, for example, four groups of buttons in menu-like panel. How would you dock them to their initial location if the window is resized?
I am trying this using DockPanel and HorizontalAlign, but it seems to only be work for the last button on the right when the window is resized. But how do you dock(anchor) a group of buttons? Maybe put them in border object and use HorizontalAlign for it? Is there more elegant way to do this?
To summarize the comments: I don't know your background but it seems you are used to another way of UI design where you do not explicitely have to specify grouping etc in code. While that might seem more elegant, it is not: the designer generated code is awful and the whole system is not as flexible nor srtaightforward as what WPF gives you..
With WPF you get a clear one-to-one relationship between your intent (treating buttons as a group within a layout) and the actual code (put the buttons in a stackpanel/grid/...). Or draw a border around buttons and organize them vertically within the border vs in xaml use a border with a stackpanel inside. It won't get any more elegant than that.
Read up on WPF layouts and once you'll get a grip of it you will quickly see that it is rather powerful and beatiful at the same time. I found this tutorial pretty helpful when just starting with layouts. And google provides lots and lots and lots more information, as usual.
Like stijn said, put the buttons in a Grid or a Stackpanel and you'll be fine.
You may not think it's beautifull, but it's the best solution for your problem.
I'm designing a UI in Visual Studio 2010, and I've come across a slight problem. I'm fairly new to XAML and this method of design, so this might be a rookie mistake. I've looked around but can't seem to find reference to a similar problem.
Basically, I have a grid with 2 rows, one of which contains a stackpanel and 5 columns. The stackpanel sits behind the columns and is used to paint the background of the entire row. When I add a background colour to the other row, I get an annoying line at the top of the stackpanel which just looks out of place. I've tried several things (showGridLines = false, transparent borders etc) but cannot seem to get rid of it. The best way to show it is through an image:
See http://img227.imageshack.us/img227/2220/tempym.jpg
One oddity I've noticed is that when I resize the window, at certain points the line disappears. Obviously this is not a solution (not least because it's going to be run full screen), but adds to the mystery of the line...
This is a trivial problem, but it is annoying me and will continue to do so until I can get rid of it, so any help would be appreciated. I've omitted the xaml for simplicity, but will post if required.
Based on the oddity you noticed, try setting SnapsToDevicePixels to true on the grid or window. Sounds like the borders are falling in between pixel boundaries and is being anti-aliased.
Or rather, if you're using .NET 4.0, use UseLayoutRounding instead.