|
Hello,
I am embarking on my first WPF project and am looking for the best way to implement a flexible master-detail view.
The project will have several views, each bound to a different underlying data source via view models. I want to produce a 'detail' view which will display the details for the currently selected object in any one of the main views. Therefore, this detail view must be flexible enough to display properties for any one of a variety of differnt object types.
What is the best technique to perform this type of 'dynamic' data binding in WPF? Is it possible purely using data templates or would I need to use something like DataSourceProvider?
Thanks!
Dan
|
|
|
|
|
You may or may not need DataSourceProvider.
For the detail view, DataTemplates work nicely since you can specify a
template for each object type (using the DataType property) so the appropriate
template is chosen automagically for any given source object.
Mark Salsbery
Microsoft MVP - Visual C++
![Java | [Coffee]](https://codeproject.global.ssl.fastly.net/script/Forums/Images/coffee.gif)
|
|
|
|
|
Thanks, thats good news..
I have had a go at implementing this using a ContentControl to display item details but have come across a further problem. I dont want to explicitly set the ContentTemplate of the content control. Instead I need this to be selected based on the type of content currently selected. I have created a set of data templates and associated each with a DataType but the content control does not pick these up. Should this work?
Thanks
Dan
|
|
|
|
|
daniel radford wrote: I have created a set of data templates and associated each with a DataType but the content control does not pick these up. Should this work?
Yes.
Make sure your master list has IsSynchronizedWithCurrentItem set to true,
and your detail's Content is binded (bound?  ) to the same collection used by the master.
Example: Different DataTemplates for different types[^]
Mark Salsbery
Microsoft MVP - Visual C++
|
|
|
|
|
Apologies, I had my DataType syntax incorrect - I now have it working perfectly. Thanks for the help!
I have a related follow up question regarding the architecture of my project. As I described before, I have several views each bound to a different viewmodel over differnt data. At the moment, each viewmodel will have a CurrentItem selected but ideally I want some kind of 'master' selection context so that only a single item is selected at any one time in the entire interface. i.e. this master viewmodel must be shared between the various views to maintain a single selected item. (I hope that makes sense!)
What is the best way to approach this?
Cheers
Dan
|
|
|
|
|
Hi,
I need to bind by data as UserControls inside a WrapPanel.
I have an ObservableCollection which is binded to the UserControl inside the WrapPanel.
If I am adding 100 data, it is working fine. But, if my data increases it is taking time to adding those usercontrols inside the panel (it becomes hanged). I need to show near about 10000 usercontrols inside the panel. OfCourse, there will be scroll to show these huge data. On every second, I am changing the collection data properties. Not adding or removing any data object but just changing the properties exposed for those data. At that time too, it becomes hanged. I need to show those data & need to change in every second.
Please help me in this matter. I am using WPF 3.5 with SP1. I checked different articles on the net & those didn't solve my problem.
Your early response regarding the same is highly appreciable.
Thanks & Regards,
- K
|
|
|
|
|
Try using a VirtualizingStackPanel, if you need the same behaviour as a WrapPanel there are some results that might help if you search for VirtualizingWrapPanel. Did you look at this article on WPF: Data Virtualization?
|
|
|
|
|
When a tab is selected, I get a line (the border of the tab control) under the tab. I want to get rid of the line between the tab content and the tabitem. This probably has something to do with the templates I'm using, but I'm not sure what I can do to address the issue. I looked around to see if you could set the color for a border on a side-by-side basis, but it doesn't look like you can. Can anyone help?
Here is my resource dictionary xaml file (in it's entirety - big text alert):
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mscorlib="clr-namespace:System;assembly=mscorlib"
>
<Style x:Key="StyleUDPBaseRepeatButton" TargetType="{x:Type RepeatButton}" >
<Style.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Opacity" Value="0.40" />
</Trigger>
</Style.Triggers>
</Style>
<Style x:Key="StyleTabControlRepeatButton" TargetType="{x:Type RepeatButton}" BasedOn="{StaticResource StyleUDPBaseRepeatButton}" >
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<Border CornerRadius="13" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- ======================================================================================================== -->
<!-- Scroller buttons for scrolling tabs -->
<Style x:Key="StyleButtonTabScrollRepeatPrev" TargetType="{x:Type RepeatButton}" BasedOn="{StaticResource StyleTabControlRepeatButton}" >
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Image Source="/CometResources;component/Images/GlassPrevTab64.png" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="StyleButtonTabScrollRepeatNext" TargetType="{x:Type RepeatButton}" BasedOn="{StaticResource StyleTabControlRepeatButton}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Image Source="/CometResources;component/Images/GlassNextTab64.png" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- TabItem with rounded corners -->
<ControlTemplate TargetType="TabItem" x:Key="UDPTabItem">
<Grid SnapsToDevicePixels="True">
<Border BorderThickness="1,1,1,0"
Padding="{TemplateBinding Control.Padding}"
BorderBrush="{TemplateBinding Border.BorderBrush}"
Background="{TemplateBinding Panel.Background}"
Name="Bd"
CornerRadius="4,4,0,0" >
<ContentPresenter RecognizesAccessKey="True"
Content="{TemplateBinding HeaderedContentControl.Header}"
ContentTemplate="{TemplateBinding HeaderedContentControl.HeaderTemplate}"
ContentStringFormat="{TemplateBinding HeaderedContentControl.HeaderStringFormat}"
ContentSource="Header"
Name="Content"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="UIElement.IsMouseOver">
<Setter Property="Panel.Background" TargetName="Bd">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStop Color="#FFEAF6FD" Offset="0.15" />
<GradientStop Color="#FFD9F0FC" Offset="0.5" />
<GradientStop Color="#FFBEE6FD" Offset="0.5" />
<GradientStop Color="#FFA7D9F5" Offset="1" />
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Trigger.Value>
<mscorlib:Boolean>True</mscorlib:Boolean>
</Trigger.Value>
</Trigger>
<Trigger Property="Selector.IsSelected">
<Setter Property="Panel.ZIndex">
<Setter.Value>
<mscorlib:Int32>1</mscorlib:Int32>
</Setter.Value>
</Setter>
<Setter Property="Panel.Background" TargetName="Bd">
<Setter.Value>
<SolidColorBrush>#FFF9F9F9</SolidColorBrush>
</Setter.Value>
</Setter>
<Trigger.Value>
<mscorlib:Boolean>True</mscorlib:Boolean>
</Trigger.Value>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected">
<Condition.Value>
<mscorlib:Boolean>False</mscorlib:Boolean>
</Condition.Value>
</Condition>
<Condition Property="UIElement.IsMouseOver">
<Condition.Value>
<mscorlib:Boolean>True</mscorlib:Boolean>
</Condition.Value>
</Condition>
</MultiTrigger.Conditions>
<Setter Property="Border.BorderBrush" TargetName="Bd">
<Setter.Value>
<SolidColorBrush>#FF3C7FB1</SolidColorBrush>
</Setter.Value>
</Setter>
</MultiTrigger>
<Trigger Property="TabItem.TabStripPlacement">
<Setter Property="Border.BorderThickness" TargetName="Bd">
<Setter.Value>
<Thickness>1,0,1,1</Thickness>
</Setter.Value>
</Setter>
<Trigger.Value>
<x:Static Member="Dock.Bottom" />
</Trigger.Value>
</Trigger>
<Trigger Property="TabItem.TabStripPlacement">
<Setter Property="Border.BorderThickness" TargetName="Bd">
<Setter.Value>
<Thickness>1,1,0,1</Thickness>
</Setter.Value>
</Setter>
<Trigger.Value>
<x:Static Member="Dock.Left" />
</Trigger.Value>
</Trigger>
<Trigger Property="TabItem.TabStripPlacement">
<Setter Property="Border.BorderThickness" TargetName="Bd">
<Setter.Value>
<Thickness>0,1,1,1</Thickness>
</Setter.Value>
</Setter>
<Trigger.Value>
<x:Static Member="Dock.Right" />
</Trigger.Value>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected">
<Condition.Value>
<mscorlib:Boolean>True</mscorlib:Boolean>
</Condition.Value>
</Condition>
<Condition Property="TabItem.TabStripPlacement" Value="{x:Static Dock.Top}" />
</MultiTrigger.Conditions>
<Setter Property="FrameworkElement.Margin">
<Setter.Value>
<Thickness>-2,-2,-2,-1</Thickness>
</Setter.Value>
</Setter>
<Setter Property="FrameworkElement.Margin" TargetName="Content">
<Setter.Value>
<Thickness>0,0,0,1</Thickness>
</Setter.Value>
</Setter>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected">
<Condition.Value>
<mscorlib:Boolean>True</mscorlib:Boolean>
</Condition.Value>
</Condition>
<Condition Property="TabItem.TabStripPlacement" Value="{x:Static Dock.Bottom}" />
</MultiTrigger.Conditions>
<Setter Property="FrameworkElement.Margin">
<Setter.Value>
<Thickness>-2,-1,-2,-2</Thickness>
</Setter.Value>
</Setter>
<Setter Property="FrameworkElement.Margin" TargetName="Content">
<Setter.Value>
<Thickness>0,1,0,0</Thickness>
</Setter.Value>
</Setter>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected">
<Condition.Value>
<mscorlib:Boolean>True</mscorlib:Boolean>
</Condition.Value>
</Condition>
<Condition Property="TabItem.TabStripPlacement" Value="{x:Static Dock.Left}" />
</MultiTrigger.Conditions>
<Setter Property="FrameworkElement.Margin">
<Setter.Value>
<Thickness>-2,-2,-1,-2</Thickness>
</Setter.Value>
</Setter>
<Setter Property="FrameworkElement.Margin" TargetName="Content">
<Setter.Value>
<Thickness>0,0,1,0</Thickness>
</Setter.Value>
</Setter>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected">
<Condition.Value>
<mscorlib:Boolean>True</mscorlib:Boolean>
</Condition.Value>
</Condition>
<Condition Property="TabItem.TabStripPlacement" Value="{x:Static Dock.Right}" />
</MultiTrigger.Conditions>
<Setter Property="FrameworkElement.Margin">
<Setter.Value>
<Thickness>-1,-2,-2,-2</Thickness>
</Setter.Value>
</Setter>
<Setter Property="FrameworkElement.Margin" TargetName="Content">
<Setter.Value>
<Thickness>1,0,0,0</Thickness>
</Setter.Value>
</Setter>
</MultiTrigger>
<Trigger Property="UIElement.IsEnabled">
<Setter Property="Panel.Background" TargetName="Bd">
<Setter.Value>
<SolidColorBrush>#FFF4F4F4</SolidColorBrush>
</Setter.Value>
</Setter>
<Setter Property="Border.BorderBrush" TargetName="Bd">
<Setter.Value>
<SolidColorBrush>#FFC9C7BA</SolidColorBrush>
</Setter.Value>
</Setter>
<Setter Property="TextElement.Foreground">
<Setter.Value>
<DynamicResource ResourceKey="{x:Static SystemColors.GrayTextBrushKey}" />
</Setter.Value>
</Setter>
<Trigger.Value>
<mscorlib:Boolean>False</mscorlib:Boolean>
</Trigger.Value>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<!-- Account Manager WINDOW tab control -->
<ControlTemplate x:Key="UDPTemplateTabControl" TargetType="{x:Type TabControl}">
<Grid x:Name="Grid" KeyboardNavigation.TabNavigation="Local">
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="ColumnDefinition0"/>
<ColumnDefinition x:Name="ColumnDefinition1" Width="0"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition x:Name="RowDefinition0" Height="Auto"/>
<RowDefinition x:Name="RowDefinition1" Height="*"/>
</Grid.RowDefinitions>
<Border Grid.Row="1"
Grid.Column="0"
x:Name="ContentPanel"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
KeyboardNavigation.TabIndex="2"
KeyboardNavigation.TabNavigation="Local"
KeyboardNavigation.DirectionalNavigation="Contained"
Background="{TemplateBinding Background}"
CornerRadius="6,6,6,6">
<ContentPresenter DataContext="{x:Null}" Margin="{TemplateBinding Padding}"
x:Name="PART_SelectedContentHost"
Content="{TemplateBinding SelectedContent}"
ContentTemplate="{TemplateBinding SelectedContentTemplate}"
ContentTemplateSelector="{TemplateBinding SelectedContentTemplateSelector}"
ContentSource="SelectedContent"/>
</Border>
<ScrollViewer x:Name="HeaderPanel" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0,0,0,0" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Disabled">
<ScrollViewer.Style>
<Style TargetType="{x:Type ScrollViewer}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<!--<Grid Margin="0,0,0,0" Grid.Row="0" Grid.Column="0" x:Name="HeaderPanel">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="23"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="23"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="23" MinHeight="23" />
</Grid.RowDefinitions>
<RepeatButton x:Name="accountPrevTab"
Grid.Column="0"
Command="ScrollBar.LineLeftCommand"
Style="{DynamicResource StyleButtonTabScrollRepeatPrev}" />
<ScrollContentPresenter Grid.Column="1" Content="{TemplateBinding ScrollViewer.Content}" />
<RepeatButton x:Name="accountNextTab" Grid.Column="2" Command="ScrollBar.LineRightCommand" Style="{DynamicResource StyleButtonTabScrollRepeatNext}"/>
</Grid>-->
<Grid Margin="0,0,0,0" Grid.Row="0" Grid.Column="0" x:Name="HeaderPanel">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="23"/>
<ColumnDefinition Width="5" />
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="5" />
<ColumnDefinition Width="23"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="23" MinHeight="23" />
</Grid.RowDefinitions>
<RepeatButton x:Name="accountPrevTab"
Grid.Column="0"
Command="ScrollBar.LineLeftCommand"
Style="{StaticResource StyleButtonTabScrollRepeatPrev}" />
<Grid Grid.Column="1" />
<ScrollContentPresenter Grid.Column="2" Content="{TemplateBinding ScrollViewer.Content}" />
<Grid Grid.Column="3" />
<RepeatButton x:Name="accountNextTab"
Grid.Column="4"
Command="ScrollBar.LineRightCommand"
Style="{StaticResource StyleButtonTabScrollRepeatNext}"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ScrollViewer.Style>
<StackPanel IsItemsHost="true" Orientation="Horizontal" Background="{x:Null}" KeyboardNavigation.TabIndex="1" />
</ScrollViewer>
</Grid>
</ControlTemplate>
</ResourceDictionary>
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
modified on Tuesday, May 19, 2009 4:55 PM
|
|
|
|
|
I've played with this problem in Blend, and I haven't been able to resolve the issue.
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
John - I'm a bit confused as to what line you get. By default, you shouldn't get a line at the bottom of the tab header - you should only get the left, top and right border lines. Are you talking about the focus rectangle? If so - all you need to do is add this style:
<Style TargetType="{x:Type TabItem}">
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
</Style>
"WPF has many lovers. It's a veritable porn star!" - Josh Smith As Braveheart once said, "You can take our freedom but you'll never take our Hobnobs!" - Martin Hughes.
My blog | My articles | MoXAML PowerToys | Onyx
|
|
|
|
|
Yep - it's the line that separates the tabitem from the tab body. Normally, you're only supposed to see it if the tab isn't selected, but when the tab is selected, (for me) it's still there.
I was just playing with it some more and may have an observation to share in about 20 minutes. I just want to make sure of what I'm seeing.
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
Okay, after too much fiddling around, figured out part of the problem. The margin on the scrollviewer element of the tabcontrol was wrong (and is still kinda wrong I think), and the margin on the tab item needed to be set in the !IsSelected state. I now have the proper separator line under unselected tabs, and no line under the currently selected tab. Now all I have to finger out is the tot and left border of the tab (which also might be a margin problem.
"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001
|
|
|
|
|
I need to define a customized event which detects whether the border of one UI element crosses the border of the other UI element.
Make this assumption that both UI elements are on a Canvas, and they have the relative coordinates toward the boundary of the Canvas which are Canvas.Left and Canvas.Bottom.
My initial thought was to create a function which checks the relative coordinates of these two elements and raise the event whenever their coordinates are identical. Then, I realized it was rather awkward because each element has its area and it can not be considered as a pixel.
I have contemplated this puzzle for quite some time but still I can not come out with anything. Would anyone be kind enough to help me out on this I will be grateful.
Thanks in advance
Someone was born greatness;
Someone achieved greatness;
Someone have the greatness thrust upon him;
|
|
|
|
|
I'm not sure exactly what you're looking for...
For rectangular elements, if you don't want to code it yourself, you
could probably use the Rect structure and its Intersect() method...if
the method returns Rect.Empty then the elements don't overlap.
Mark Salsbery
Microsoft MVP - Visual C++
![Java | [Coffee]](https://codeproject.freetls.fastly.net/script/Forums/Images/coffee.gif)
|
|
|
|
|
Thanks Mark for your information.
I did a little bit of research on the method you provided me, and I found out this Intersect() method belongs to a GDI+ rectangle structure and it's not supported in WPF shapes. Are there any other methods which can substitute this one?
BTW, you are right about what I am looking for. In my program, I need to use an event to detect the intersection of different WPF UI elements in order to process some task once they cross over with each other.
Someone was born greatness;
Someone achieved greatness;
Someone have the greatness thrust upon him;
|
|
|
|
|
YouMiss wrote: this Intersect() method belongs to a GDI+ rectangle structure and it's not supported in WPF shapes
You looked at the wrong one.
Rect Structure (System.Windows)[^]
Mark Salsbery
Microsoft MVP - Visual C++
|
|
|
|
|
Thanks very much, I probably should have searched harder, I will try it out!
Someone was born greatness;
Someone achieved greatness;
Someone have the greatness thrust upon him;
|
|
|
|
|
Hi,
I have a requirement in which i need to show
1. a Plane of a Cube ( Plane will be selected by the users by setting the apporpriate x,y and Z values) and i need to plot the Tempreture data (i get an array of X y z and Tempreture values in an Array) on it .
Can anyone give me some idea ?
2. I will be given an Array of X,y,Z points and i need to plot them.
I am not sure how i can do this in WPF ?
Any help will be highly appreciated .
|
|
|
|
|
I think I am working on something somewhat similar and while I am probably ahead of you on this one, I am a long, long way from done. A screenshot of where I am now is shown below.
Basically, the way I am doing it, I have three planes, one for each axis. I also have a two dimensional user control that does two dimensional XY graphs. I am using three VisualBrushes, one for each plane and passing an instance of the two dimensional usercontrol into the constructor of those VisualBrushes. I am then using those VisualBrushes to texture the three axis planes. For the points, I am creating spherical meshes and positioning them inside of the XYZ chart area.
When I finally get done with this whole thing, which won’t happen anytime soon, I will do one or more posts on it on my blog with source code. However, I am so far from done that that may be a while. I won’t publish the code that I have at this point in time because it is so crude and filled with quick and dirty workarounds that I don’t want it on the web in its current form. I hope this helps at least with the getting started part though.
http://www.trentfguidry.net/MyImages/Peng-Robinson-Methanol-Graph.jpg
Niladri Biswas
|
|
|
|
|
Any third party control for Data Grid with all the event as in WINFORM DataGrid for WPF?
|
|
|
|
|
There's one in the WPF Toolkit[^].
The toolkit is where you can get your hands on controls before they make it into the
.NET framework.
Mark Salsbery
Microsoft MVP - Visual C++
|
|
|
|
|
Infragistics WPF control. We are heavily using it.
Try that.
Or else, in codeplex, you will get WPF datagrid.
Search in google for the same
Niladri Biswas
|
|
|
|
|
Does anybody know where i can get very powerful open source 3d wpf charts. I'm looking for charts with onclick events and rich color shading and filling. The module should also provide pie charts.
Thx in advance
|
|
|
|
|
Visifire is an open Source WPF Charting component.
|
|
|
|
|
hi all,
i have a writableBitmap which i want to save on server. Is there any way to save it may be using webservice?? i Dont kno!!!
Thanks in advance
Samir
|
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
