positioning of elements in xaml - silverlight

I have 2 ListPicker's.
For example:
<toolkit:ListPicker FullModeItemTemplate="{Binding lpkFullItemTemplate}" ItemTemplate="{Binding lpkItemTemplate}"
x:Name="lpkIcon">
</toolkit:ListPicker>
<toolkit:ListPicker FullModeItemTemplate="{Binding lpkFullItemTemplate}" ItemTemplate="{Binding lpkItemTemplate}"
x:Name="lpkWhen">
</toolkit:ListPicker>
This Listpickers are located near. When i am click on first listpicker it shows the menu, but its covered by the second listpicker.
I tried to disable the visibility of second listbox when i click on first, but i think everything can be done through the xaml.
sorry for really stupid question and thanks.

I'm presuming you're talking about when the ListPicker is NOT in full mode (which opens in full screen).
How the two list pickers will interact visually will ultimately depend on the type of panel they're both contained in. So I can't give you a better answer unless I know which Panel you're using.
I use a lot of List Pickers in one of my apps To Do Today and my best suggestion is to use a Stack Panel wrapped with a Scroll Viewer.

Related

how to use xaml magic

I have problems figuring out where to use what xaml keywords because its hard to figure out what hierarchy it wants. It seems there is some grand design on how and where to use attributes, properties or child nodes.
<Node Attribute="True">
<Node.Property />
</Node>
I found this beautiful page explaining all the ribbon menu properties, but have no idea how to use them in xaml. After half an hour of searching and trying everything I managed to get an Icon to show in the ribbon menu button.
What is the logic behind this all and how to figure out what to use where?
How to merge the ribbon menu with the application bar (the top bar on most windows applications)? So I get a nice Ribbon Application Menu, like in the example.
Is there a way to turn off xaml background compliation? I'd sacrifice Intellisense for this.
Because the xaml editor performance is abysmal, the are many suggestions for this, but none working so far.
Edit:
I know the xaml syntax, but there's no hint on what hierarchy to use. So if I find the object I want to use (because they are all available) it will only say I'm using the wrong object, it should ask for the kind of object it wants to be in.
Also in normal programming when you use a reference you can always use all classes in it. With xaml we must suddenly know what reference our class came from, also it won't find the reference for you, you either have to try all references to see if they have a certain class or find a code example.
Good questions. Its a little hard to get a feel for exactly what you're asking for in your #1 question, but I'll take a brief stab at that one. I do have an answer for your #2 question. I do not have an answer for your #3.
"1. What is the logic behind this all and how to figure out what to use where?"
Like Clemens mentioned, the XAML Overview does a pretty good job at explaining things.
I'm guessing that one of the main things that you're asking about is basically "when do you use attribute syntax vs property element syntax". From that doc:
For some properties of an object element, attribute syntax is not possible, because the object or information necessary to provide the property value cannot be adequately expressed within the quotation mark and string restrictions of attribute syntax. For these cases, a different syntax known as property element syntax can be used....
Now about this part of your question...
"Also in normal programming when you use a reference you can always use all classes in it. With xaml we must suddenly know what reference our class came from, also it won't find the reference for you, you either have to try all references to see if they have a certain class or find a code example."
If part of your question is more about how can you more-easily handle your XAML (or more appropriately xmlns) namespaces so that it is easier to get references ironed out in your XAML, there is a technique that you may find useful. It lets you consolidate namespaces so that you can use fewer XAML namespace prefixes (or even no namespace prefixes if you take this technique to its extreme).
"2. How to merge the ribbon menu with the application bar (the top bar on most windows applications)? So I get a nice Ribbon Application Menu, like in the example."
Essentially it seems that you're asking how to: (a) extend the window chrome area (the Aero glass area) down into the client part of the window (the part that your application normally gets to put things) and (b) extend the client part of the window up into the window chrome area. If you can do both of these things, then you can end up with something that looks like Microsoft office products or modern web browsers. Fortunately there is the WPF Shell Integration Library which helps you do both of these things. I found this blog and this blog (and the source code they offer) good guides for getting started with using the WPF Shell Integration Library.
Using this library, I was able to make this window (all but the Aero color changing abilities which is a whole other topic). Notice that both of qualities I mentioned are working here (the TabControl is being display up in the normal window chrome top bar area and the window chrome Aero glass is being displayed down in the normal client area):
Here's my take
1) What is the logic behind this all and how to figure out what to use
where?
Whatever you can fit between "" can go inline like:
<TextBlock Text="{Binding Name}" />
Whatever can't, go the element way:
<TextBlock>
<TextBlock.Text>
<MultiBinding StringFormat="{}{0} ({1})">
<Binding Path="Name" />
<Binding Path="Gender" />
</MultiBinding>
</TextBlock.Text>
</TextBlock>
2) How to merge the ribbon menu with the application bar (the top bar on
most windows applications)? So I get a nice Ribbon Application Menu,
like in the example.
You'll find more or less complicated mumbo jumbo around google, this is the essence of it:
<Window ...
WindowStyle="None" AllowsTransparency="True" Background="Transparent"
...>
<!-- Fill it up with a PNG image if you want to play with transparency -->
</Window>
Then make the ribbon the top element, and re-create Close/Maximize buttons
3) Is there a way to turn off xaml background compliation? I'd sacrifice
Intellisense for this.
Yep, it's called Notepad++

DevExpress GridControl ColumnAutoWidth

The question is probably silly, but I spent half of the day looking for the answer with no luck.
I have a WPF view with DevExpress GridControl included (not developed by me). The problem is that when I click "Auto fit" option - it gets too wide with a horizontal scroll. The reason is long header titles, but it's Ok if they are wrapped into 2 lines.
After some searching, I thought that what I need is ColumnAutoWidth property. The problem (here goes the silly part) is that I can't find out how to set it! Because of this I can't check if it works at least! There are no examples in documentation, and code autocomplete doesn't show it's presence anywhere. I had some assumptions but they appeared to be wrong.
Can somebody please share XAML (or at least code-behind) example about how to access this property?
you just have to remove width element from your columns, and to set the autowidth element of the tableview. the link you posted is related xtraGrid control and it is a windows form not a WPF one, you have to control the width from the TableView.AutoWidth property.
Try to read the following documentation
Your link is documentaion for WinForms grid. For Wpf GridColumn http://documentation.devexpress.com/#WPF/DevExpressXpfGridGridColumnMembersTopicAll
As I understand you question - you want to fix column width. Try this
<dxg:GridColumn Header="MyAwesomeColumn"
Width="40"
FixedWidth="True"
FieldName="MyFieldName" />

Howto edit TopLevelHeaderTemplates PART_Popup in Expression Blend

I am very new to Expression Blend but can't find any solution with google. I would like to style a Menu and it's items. But how can I see the actual look of the PART_Popup? The IsOpen Property is bound to something like {Binding IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}. It seems I am only looking at something complete invisible :). There is also a SystemDropShadowChrome but I actually can't see this thing. The eyes next to all the items are active. And even if I change some background colors all that I see is just a black transparent rectangle.
Is this a toolkit control (dropdownmenu) or a telerik (radmenu) or something? If you've already broken out the template (eg; Right click->Edit Template->Edit Current/Copy) Then there's a couple things you want to try to find it since sometimes they can be oddly embedded.
Go to the root level of the control, try Right Click->Edit Additional Templates->...
If that' doesn't provide your part_ look in your broken out template resource you've created and inspect your object tree. You're looking for embedded controls appearing as objects. Right click the embedded control in your object tree and edit its template (Current or Copy)
You'll potentially sometimes have to drill down multiple layers within a template to expose the objects you wish you to edit. If you specify which control you're working with I'm sure we can tell you exactly how to get to where you need more efficiently. Cheers!
Try exploring the States tab. Most likely some of the parts are only visible in certain states.

How to create databinding over two xaml files?

I am trying to come to a working understanding of how databinding works, but even after several tutorials I only have a basic understanding of how databinding works. Thus this question might seem fundamental to those more familiar with silverlight. Even if it is trivial, please point me to some tutorial that deals with this problem. All that I could find simply solved this via adding the data binding on a parent page.xaml (that i must not use in my case).
For the sake of this example let us assume, that we have 5 files:
starter.cs
button1.xaml + codeBehind
button2.xaml + codeBehind
The two buttons are generated in code in the starter(.cs) file, and then added to some MapLayer
button1 my_button1 = new button1();
button2 my_button1 = new button2();
someLayer.Children.Add(my_button1);
someLayer.Children.Add(my_button2);
My aim is to connect the two buttons, so that they always display the same "text" (i.e. my_button1.content==my_button2.content = true;). Thus when something changes my_button1.content this change should be propagated to the other button (two way binding).
At the moment my button1.xaml looks like this:
<Grid x:Name="LayoutRoot">
<Button x:Name="x_button1" Margin="0,0,0,0" Content="{Binding ElementName=x_button2, Path=Content}" ClickMode="Press" Click="button1_Click"/>
</Grid>
But everthing that i get out of that is a button with no content at all, it is just blank as the binding silently fails.
How could I create the databinding in the context I described? Preferably in code and not XAML ;)
Thanks in advance
The chunk of documentation you need to read is this: XAML Namescopes
Your button1 xaml has a binding looking for an element with the name "x_button2". However in a real application there can be many controls which in turn have nested controls. All of these controls have all manner of UI elements some of which may have names.
It would be impossible to get anything done if all names throughout the entire application had be unique. Yet that would need to be true if it were for your button1 to be able to hunt down the existence of another control somewhere in the visual tree outside of that which it actually knows (its own xaml).
Hence each loaded Xaml document exists in its own "namescope" and the search for other elements with other names is limited to that "namescope".
The are various solutions to this problem depending on what you real requirements are as opposed to the simplified problem in your question.
Typically you give each of your controls a DependencyProperty to which the inner button Content property binds. In "MapLayer" as call it, could then bind the propert on one of your button controls to the other.

How to display multiple layers of controls in WPF?

I am trying to learn WPF and so far I love it. However, there is something missing or simply something that I don't understand. How can we display multiple layers of controls in WPF? Attached, the screenshot gives a good idea of what I am trying to do. I have a window and I want to display something else on top of it. How can I do that?
Placing two elements into the same row/column in a Grid simply overlays them. You can then use the Visibility on each element to show/hide them. So for example:
<Grid>
... row/column definitions
<Grid Grid.Row="0" Grid.Column="0">
... main content here
</Grid>
<Grid Grid.Row="0" Grid.Column="0" x:Name="grid2">
... overlaid content here
</Grid>
</Grid>
Now the overlaid content will appear over the top of the main content content. Setting grid2.Visibility to Visible/Hidden will show/hide your overlaid content.
I can think of two ways to achieve this effect (non rectangular semi transparent overlay on top of a window that extends behind the window's bounds).
First option, DON'T USE THIS IN PRODUCTION CODE (AllowTransparency is slow and very buggy) - Make the window larger then the actual content, set AllowsTransaprencey="True" so that the area "outside" of the window is transparent, now all you have to do for the popup is to add another visual in the same container as the "window" .
Second option, use a Popup, you will have to position your popup carefully, call SetWindowRgn via interop to make it non rectangular and call the Win32 API function that sets transparency value (sorry, don't remember the name at the moment) to make it semi-transparent.
The first option is easy to implement and will look better then the second option, but it's slower and you will run into all sorts of weird bugs (including crushes with some display drivers) - I know this from experience, when I switched the software I'm selling from AllowTransparency to SetWindowRgn 90% of the crush reports disappeared.
The second options requires a lot of native Win32 API calls but it should work.
I don't know much about WPF myself, but is the Panel.ZIndex attached property what you're after, perhaps?
you can use adorner layer to overlay . It's basically a rendering surface that overlays any adorned element.
You could achieve a similar effect by overlaying things in a grid (things just stack on top of each other if they're in the same cell), but my spider sense would tell me that that is just another window defined something like:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="SubWindow" Height="100" Width="100" WindowStyle="None" AllowsTransparency="True" Opacity="0.5" >
You could then show it in you main window by doing something like:
SubWindow sw = new SubWindow ();
sw.DoModal();
Not sure exactly what you are trying to accomplish but from my brief encounters with WPF, it seems like maybe you might accomplish what you need with the proper configuration of a parent\child relationship between your two windows. I recently so a basic 'hello, world' on Dr. Dobb's portal that may give you some direction.
Here's the link to the training tutorial video -- Dr. Dobb's TV you will just need to select the "Build a Standard WPF Application' video from the list...

Resources