Windows Phone 8.1 ListView with only 2 columns and unlimte row - xaml

I'm trying to make a Listview with 2 columns, exactly like this picture:
http://i62.tinypic.com/10mrd5x.png
(Items most be vertical and exactly like the picture)
I know about WrapGrid and I can use this
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<WrapGrid Orientation="Horizontal"
MaximumRowsOrColumns="2"
HorizontalAlignment="Center"
VerticalChildrenAlignment="Stretch"
HorizontalChildrenAlignment="Stretch" />
</ItemsPanelTemplate>
</ListView.ItemsPanel>
but this is too bad for what I want! this makes unlimited Columns when items is more than of screen height(when add 100 items to listview)
but I want just only 2 columns with unlimite rows.
My questions is:
Is this possible?
if Yes how can I do it?
sorry for my poor english

I did the same thing in WP 7.8 using the ListBox. /this is the part of my old project. Sorry for large number of useless tags and parameters :)
<ListBox
Height="573"
HorizontalAlignment="Left"
Name="MyWallslistBox"
VerticalAlignment="Top"
DataContext="{Binding}"
ItemsSource="{Binding}"
Tap="wallslistBox_Tap"
Width="480"
Margin="0,-10,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel
Orientation="Horizontal"
Margin="10,10,0,0">
<Image
Source="{Binding Image}"
Height="225"
Width="225"
HorizontalAlignment="Left"
/>
<StackPanel
Orientation="Vertical"
HorizontalAlignment="Stretch"
Margin="-227,-3,-10,0">
<StackPanel
Background="#56000000"
HorizontalAlignment="Left"
VerticalAlignment="Top"
MaxHeight="225"
Margin="2,3,0,0"
Width="225"
Height="225">
<TextBlock
TextWrapping="Wrap"
MaxWidth="235"
HorizontalAlignment="Left"
Text="{Binding Title}"
Foreground="White"
FontSize="24"
Margin="10,4,0,0"
/>
</StackPanel>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<toolkit:WrapPanel Width="480" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>

Related

XAML parsing/layout rendering time very high

I've got the problem, that I create an App, that will run on Windows Phone 8.1 and Windows 10 Mobile. This App is a non-UWP Windows Store App.
The problem I have is, that I have a list of a custom control that one has another List, that is not expanded (=collapsed). That looks like this:
The red rectangles are the ContentPresenter items of the first ItemControl and the green rectangles are the ContentPresenter items of the ItemControl in the first lists items, that is not visible on startup. It will be visible after the click on the expand-button. Both ItemControls have a DataTemplate configured to present what you see in the screenshot. (XAML code below)
The main problem I have is, that if I change the Pivot to the Pivot you see at the screenshot above, there is a freeze of the app for several seconds. It depends on the device how long this freeze is. In the W10M-Emulator on my PC I don't recognize a freeze but on a Lumia 620 with WP8.1 I have a freeze of 8.5 seconds.
In the profiler of Visual Studio it looks like this (I selected the range that is the problem I am talking about):
What I am wondering about is the large orange line with "Layout". If I expand it to the "big players", there is 60-70ms for each not visible item in the profiler.
I am asking myself why this is the case, even if the items are not visible and are in the VirtualizingStackPanel. The Number of Items of the ItemSourcein this example is 3 for the first ItemControl (red boxes) and 17, 59 and 1 for the second ItemControls that are only visible of the first item is expanded.
What I am also wondering about is, that regarding the timeline, all of the Items are processed at the same time because their baseline is for all items the same. But if I scroll down the profiler timeline details, I see another Event called "Parsing" for each item. That one is not processed in parallel for each item but serial. And the parsing of the last item fits to the end of the layout-event. This parsing events look like this:
What is the reason why the parsing takes so long time? I don't think that the controls are very complex etc. and there are no code behind procedures except some string formattings.
Finally here is the XAML code:
My PivotItem on the "MainPage" of the App:
<PivotItem
Header="Echtzeit"
Margin="10,-20,10,0"
>
<Grid>
<ScrollViewer
VerticalScrollBarVisibility="Visible"
>
<ItemsControl
ItemsSource="{Binding RealtimeDepartures, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
HorizontalAlignment="Stretch"
Margin="0"
>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<controls:RealtimeStation
StationName="{Binding StationName, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
Departures="{Binding DepartureList, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
FontSize="{Binding DataContext.ClientFontSize, ElementName=MainPg, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
</Grid>
</PivotItem>
The RealtimeStation Control XAML:
<UserControl
...
>
<UserControl.Resources>
<dec:BoolToVisibilityConverter x:Key="BoolToVisibilityConv"/>
</UserControl.Resources>
<Grid>
<AppBarButton
HorizontalAlignment="Left"
VerticalAlignment="Top"
Grid.Column="0"
Name="btnExpand"
Icon="{Binding ExpandButtonIcon, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
Click="btnExpand_Click"
IsEnabled="{Binding IsExpandButtonEnabled, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
IsCompact="True"
Margin="0,-8,-2,-4"
/>
<StackPanel
Orientation="Vertical"
Margin="48,12,0,0"
>
<TextBlock
Text="{Binding StationName, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
VerticalAlignment="Center"
FontSize="24"
/>
<TextBlock
Text="Derzeit stehen keine Abfahrten an"
FontStyle="Italic"
Visibility="{Binding ShowNoDepartures, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
FontSize="{Binding FontSize, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
/>
<TextBlock
Text="Zugausfälle vorhanden!"
Foreground="Red"
FontWeight="Bold"
Visibility="{Binding ShowTrainCanceled, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
FontSize="{Binding FontSize, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
/>
<ItemsControl
ItemsSource="{Binding DepartureList, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
ScrollViewer.VerticalScrollBarVisibility="Visible"
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
Margin="-48,0,0,0"
Visibility="{Binding IsExpanded, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay, Converter={StaticResource BoolToVisibilityConv}}"
>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<ContentPresenter>
<controls:RealtimeDeparture
DepartureDetails="{Binding}"
FontSize="{Binding FontSize, ElementName=main, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
/>
</ContentPresenter>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</Grid>
</UserControl>
And finally the RealtimeDeparture Control:
<UserControl
...
>
<Grid>
<control:DisruptionIcon
Height="24"
Width="50"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Icon="{Binding TrainIcon, UpdateSourceTrigger=PropertyChanged, Mode=OneWay}"
Margin="3"
/>
<StackPanel
Orientation="Vertical"
Margin="56,9,0,0"
>
<StackPanel
Orientation="Horizontal"
Margin="3,0"
VerticalAlignment="Center"
>
<TextBlock
Text="{Binding DelayTimeText, ElementName=main, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
Foreground="{Binding DelayColor, ElementName=main, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
/>
<TextBlock
Text="{Binding DepartureDetailsText, ElementName=main, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
Margin="3,0"
/>
</StackPanel>
<TextBlock
Text="{Binding InformationText, UpdateSourceTrigger=PropertyChanged, Mode=OneWay, ElementName=main}"
Visibility="{Binding IsInformationVisible, UpdateSourceTrigger=PropertyChanged, Mode=OneWay, ElementName=main}"
Margin="3"
FontStyle="Italic"
TextWrapping="Wrap"
/>
<TextBlock
Text="Zug fällt aus!"
Foreground="Red"
FontWeight="Bold"
Visibility="{Binding IsCanceledVisible, UpdateSourceTrigger=PropertyChanged, Mode=OneWay, ElementName=main}"
Margin="3"
/>
</StackPanel>
</Grid>
</UserControl>
Does anybody has an idea how to speed up this parsing? What is the reason why it is so slow? Do I have a design issue that is disabling the virtualization-functionality of the VirtualizedStackPanel? I already tried a lot but didn't find the reason why it is so slow.
I don't think virtualization is turned on.
Try setting the CanContentScroll property to true on your ScrollViewer:
<ScrollViewer
CanContentScroll="true"
VerticalScrollBarVisibility="Visible"
>
The other option can be using e.g. ListBox which supports virtualization on its own (as far as I know it is enough to set the ItemsPanelTemplate to VirtualizingStackPanel)

listbox horizontal alignment wrap

how can I start items on a new row in a listbox which is orientated horizontally? this is my code so far, but it shows al the items in 1 row, thanx in advance
<phone:PanoramaItem Header="Geklassifiseerd" Orientation="Horizontal" Foreground="Black">
<ListBox x:Name="geklassifisseerd_list">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}" TextWrapping="Wrap"
Margin="10,0"
Foreground="Black"
FontSize="20"
/>
<TextBlock Text="{Binding Date}"
TextWrapping="Wrap"
Foreground="Black"
Margin="10,-2,10,0"
FontSize="20"
/>
<TextBlock Text="{Binding Image_uri}"
TextWrapping="Wrap"
Margin="10,-2,10,0"
Foreground="Black"
/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ListBox>
got the answer, I used a wrappanel in the itemspanetemplate, which led to assemblies clashing, which I solved by reinstalling the Microsoft.phhone.controls assembly via nugget
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Controls:WrapPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>

ItemsGroups in my GridView don't wrap and are located out of the screen

I just implemented a GridView with groups feature. I have a list of TVshows's episodes which are grouped by diffusion date.
When I have more than 3 episodes by date, I want to have my items wrapped and go next to the group title, at this time, the next items are going outside of the screen, and it not what I wanted.
As you can see, there is other episodes under the dupplicated one for each day, I want them to go next to the others, not under.
Here is my XAML code, thanks :)
<GridView Margin="70,0,0,40" ItemsSource="{Binding Source={StaticResource cvsActivities}}">
<GridView.Template>
<ControlTemplate>
<ItemsPresenter />
</ControlTemplate>
</GridView.Template>
<GridView.ItemContainerTransitions>
<TransitionCollection>
<EntranceThemeTransition IsStaggeringEnabled="True" />
<RepositionThemeTransition />
<AddDeleteThemeTransition />
</TransitionCollection>
</GridView.ItemContainerTransitions>
<GridView.ItemTemplate>
<DataTemplate>
<Grid>
<StackPanel Orientation="Vertical">
<Grid Name="grid_image">
<Image Width="280" Height="200" VerticalAlignment="Center" Stretch="UniformToFill" Source="Assets/no_image.png" />
<Image Width="280" Height="200" VerticalAlignment="Center" Stretch="UniformToFill" Source="{Binding saison.serie.poster}" />
</Grid>
<Image Source="Assets/Ban-1hh.png" Width="280" Height="59" Margin="0,-19,0,0"/>
<Grid Margin="0,-40,0,0" Height="40">
<StackPanel HorizontalAlignment="Left" Orientation="Vertical" VerticalAlignment="Center" Margin="0,-7,0,0">
<TextBlock HorizontalAlignment="Left" Margin="5,0,0,0" Width="190" TextTrimming="WordEllipsis" Foreground="White" FontSize="20" Text="{Binding saison.serie.nom}" />
<TextBlock HorizontalAlignment="Left" Margin="5,-5,0,0" Width="190" TextTrimming="WordEllipsis" Foreground="White" FontSize="13" Text="{Binding date}" />
</StackPanel>
<StackPanel VerticalAlignment="Center" HorizontalAlignment="Right" Orientation="Vertical" Margin="0,-5,5,0">
<StackPanel Orientation="Horizontal" FlowDirection="RightToLeft">
<TextBlock Foreground="#f0ec45" FontSize="14" Text="{Binding saison.number}" />
<TextBlock Foreground="#f0ec45" FontSize="14" Margin="5,0,0,0" Text="Saison " />
</StackPanel>
<StackPanel Orientation="Horizontal" FlowDirection="RightToLeft" Margin="0,-5,0,0">
<TextBlock Foreground="#f0ec45" FontSize="14" Text="{Binding ep_number}" />
<TextBlock Foreground="#f0ec45" FontSize="14" Margin="5,0,0,0" Text="Episode " />
</StackPanel>
</StackPanel>
</Grid>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Grid Background="LightGray" >
<TextBlock Text="{Binding Key, Converter={StaticResource StringFormatConverter}, ConverterParameter='{}{0:dddd dd MMM yy}'}" Foreground="Black" Margin="10"
Style="{StaticResource PageSubheaderTextStyle}" />
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</GridView.GroupStyle>
</GridView>
Add a ItemsPanelTemplate (if you take a look at the default GridApp and the GroupedItemsPage.xaml, you'll see this is how they do it).
<GroupStyle.Panel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid Orientation="Vertical" Margin="0,0,80,0" />
</ItemsPanelTemplate>
</GroupStyle.Panel>
If you want the 3rd element in a column to leak over the bottom, then you can set a negative bottom margin on the GridView itself.
You virtually erased the GridView control template, so no wonder it doesn't work. Remove the following part and things might get back to normal:
<GridView.Template>
<ControlTemplate>
<ItemsPresenter />
</ControlTemplate>
</GridView.Template>
If there is something you want changed in the default template - change that specific thing. The default template has a horizontal ScrollViewer which limits vertical space use by the WrapGrid that is used for its ItemsPanelTemplate and allows items to wrap to next column, while also allowing to scroll horizontally to see all items.

semantic zoom control throwing exception when groups are empty

have a semantic zoom control in an application where I've got three groups (today, tomorrow and later), but the groups don't necessarily always have at least one item. The semantic zoom control works perfect when all three groups are non-empty, but not whenever any of the items are empty. I've tried clearing out my DataTemplate to ensure it's nothing to do with the bindings, and I couldn't find an event to hook on to so that I could potentially step through what was going on when the zoom-out event is triggered.
Has anyone got this working, or have any ideas/suggestions/tips/workarounds?
some code:
XAML - collectionviewsource:
<!-- Collection of grouped items displayed by this page -->
<CollectionViewSource
x:Name="groupedItemsViewSource"
Source="{Binding Groups}"
IsSourceGrouped="True"
ItemsPath="Items"
d:Source="{Binding ItemGroups, Source={d:DesignInstance Type=data:AuctionDataSource, IsDesignTimeCreatable=True}}"/>
XAML - semantic zoom control:
<SemanticZoom Visibility="Collapsed" Grid.Row="1" Name="MainSemanticZoom">
<SemanticZoom.ZoomedInView>
<GridView
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemGridView"
AutomationProperties.Name="Grouped Items"
Margin="116,0,40,46"
ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
SelectionMode="Multiple"
SelectionChanged="itemGridView_SelectionChanged_1">
<GridView.ItemTemplate>
<DataTemplate>
<Grid HorizontalAlignment="Left" Width="250" Height="200" RightTapped="Grid_RightTapped_1" Tag="{Binding}">
<Border Background="{StaticResource ListViewItemPlaceholderRectBrush}">
<Image Source="{Binding Image}" Stretch="UniformToFill"/>
</Border>
<StackPanel Grid.Column="1" VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundBrush}">
<!--bindings: Title , CurrentBid, CloseDate -->
<TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayTextBrush}" Height="20" Style="{StaticResource TitleTextStyle}" Margin="15,0,15,0"/>
<TextBlock Text="{Binding CurrentBid, Converter={StaticResource FormatStringConverter}, ConverterParameter='\{0:C}'}" Foreground="{StaticResource ListViewItemOverlayTextBrush}" Style="{StaticResource TitleTextStyle}" TextWrapping="NoWrap" Margin="15,0,15,0"/>
<TextBlock Text="{Binding CloseDate, Converter={StaticResource FriendlyTimeConverter}}" Foreground="{StaticResource ListViewItemOverlayTextBrush}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap" Margin="15,0,15,10"/>
<Border Visibility="{Binding IsLeading, Converter={StaticResource BooleanToVisibilityConverter}}" Name="leadingBlock" Background="CadetBlue">
<TextBlock Text="leading" Style="{StaticResource BodyTextStyle}" Margin="15,0,15,10"></TextBlock>
</Border>
<Border Visibility="{Binding IsOutbid,Converter={StaticResource BooleanToVisibilityConverter}}" Name="outbidBlock" Background="Orange">
<TextBlock Text="outbid" Style="{StaticResource BodyTextStyle}" Margin="15,0,15,10"></TextBlock>
</Border>
<Border Visibility="{Binding NoBids,Converter={StaticResource BooleanToVisibilityConverter}}" Name="noBidsBlock" Background="Gray">
<TextBlock Text="you have not placed a bid" Style="{StaticResource BodyTextStyle}" Margin="15,0,15,10"></TextBlock>
</Border>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
<GridView.GroupStyle>
<GroupStyle>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<Grid Margin="5,0,30,10">
<!--<Button
AutomationProperties.Name="Group Title"
Content="{Binding Title}"
Click="Header_Click"
Style="{StaticResource TextButtonStyle}"/>-->
<TextBlock Text="{Binding Title}" Style="{StaticResource SubheaderTextStyle}"></TextBlock>
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<VariableSizedWrapGrid Orientation="Vertical" Margin="0,0,80,0"/>
</ItemsPanelTemplate>
</GroupStyle.Panel>
</GroupStyle>
</GridView.GroupStyle>
</GridView>
</SemanticZoom.ZoomedInView>
<SemanticZoom.ZoomedOutView>
<GridView
x:Name="itemZoomOutGridView"
AutomationProperties.AutomationId="ItemZoomOutGridView"
AutomationProperties.Name="Grouped Items"
SelectionMode="None">
<GridView.ItemTemplate>
<DataTemplate>
<Grid HorizontalAlignment="Left">
<Border Background="{StaticResource ListViewItemPlaceholderRectBrush}">
<Image Height="750" Source="{Binding Group.Image}" Stretch="UniformToFill"/>
</Border>
<StackPanel Height="140" Width="400" Background="Orange" VerticalAlignment="Center">
<TextBlock Margin="15" Text="{Binding Group.Title}" Foreground="White" Style="{StaticResource HeaderTextStyle}"></TextBlock>
<TextBlock Margin="15" Grid.Row="1" Text="{Binding Group.Items.Count}" Foreground="White" Style="{StaticResource HeaderTextStyle}"/>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<WrapGrid Margin="230,0,0,0" Width="2000" Orientation="Horizontal"/>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
</SemanticZoom.ZoomedOutView>
</SemanticZoom>
I "solved" this by handling the ViewChangeStarted and the ViewChangeCompleted events of the SemanticView control. In the ViewChangeStarted event I added a new item, so that group won't be empty, and in the ViewChangedCompleted event I removed it. It's not a fix, just a workaround, but it does the job.
I don't think this is SemanticZoom issue. We reported very similar issue with GridView with grouped source. If any of the groups were empty we got exception. In fact CollectionViewSource is the likely culprit in this.
Our solution was not to use GridView with grouping. You can configure ItemsControl to look just like grouped GridView. The only downside to this is that you can't select items from different groups at the same time, but for us it was not an issue, since we didn't need selection.

ComboBox in DataForm, SL4

I know that this question is what many of you already posted, but I'm still having a problem. The idea is very simple: I have a DataGrid and when I select the item in DataGrid, it should select item in ComboBox which is in DataForm. I have read many posts, and implemented few ideas in what I did, and now, I have this:
<StackPanel Grid.Column="1" Grid.Row="4" Name="stackPanel1" Margin="0,0,0,-257">
<sdk:DataGrid Name="PhysicalQuantitiesGrid"
MinHeight="100" IsReadOnly="True"
Margin="0,12,0,0"
ItemsSource="{Binding PhysicalQuantities}"
SelectedItem="{Binding Path=CurrentPhysicalQuantity, Mode=TwoWay}"
AutoGenerateColumns="False" VerticalGridLinesBrush="{x:Null}">
<sdk:DataGrid.RowDetailsTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" Margin="5">
<StackPanel Orientation="Horizontal" Margin="5">
<StackPanel Orientation="Vertical" Margin="5">
<TextBlock
FontSize="12"
Width="Auto"
Text="Base unit term"/>
<TextBlock
Foreground="CadetBlue"
FontSize="12"
Width="Auto"
TextWrapping="Wrap"
Text="{Binding Path=Unit.Term}"/>
</StackPanel>
<StackPanel Orientation="Vertical" Margin="5">
<TextBlock
FontSize="12"
Width="Auto"
Text="Short term"/>
<TextBlock
Foreground="CadetBlue"
FontSize="12"
Width="Auto"
TextWrapping="Wrap"
Text="{Binding Path=Unit.ShortTerm}"/>
</StackPanel>
</StackPanel>
</StackPanel>
</DataTemplate>
</sdk:DataGrid.RowDetailsTemplate>
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn Header="Term"
Binding="{Binding Path=Term}"
FontSize="14"
Foreground="DarkBlue"
>
</sdk:DataGridTextColumn>
</sdk:DataGrid.Columns>
</sdk:DataGrid>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Margin="0,12,0,0">
<Button x:Name="NewPhysicalQuantity" Content="AddNew" Height="23" Click="NewPhysicalQuantity_Click"/>
</StackPanel>
<dataform:DataForm x:Name="PhysicalQuantityDetails"
Header="Fizicke velicine - detalji"
AutoGenerateFields="False"
AutoEdit="False"
CommandButtonsVisibility="Commit,Cancel,Edit"
Margin="0,12,0,0"
CurrentItem="{Binding Path=CurrentPhysicalQuantity}"
CancelButtonContent="Cancel"
CommitButtonContent="Commit"
>
<dataform:DataForm.EditTemplate>
<DataTemplate>
<StackPanel>
<dataform:DataField Label="Physical Quantity term:">
<TextBox Text="{Binding Path=Term, Mode=TwoWay}" />
</dataform:DataField>
<dataform:DataField Label="Base unit">
<StackPanel>
<riaControls:DomainDataSource AutoLoad="True" Height="0" Name="baseUnitsDataSource" QueryName="GetBaseUnitsOrdered" Width="0">
<riaControls:DomainDataSource.DomainContext>
<myService:DomainDomainContext/>
</riaControls:DomainDataSource.DomainContext>
</riaControls:DomainDataSource>
<myControl:ComboBox
ItemsSource="{Binding ElementName=baseUnitsDataSource, Path=Data}"
SelectedValuePath="IDUnit"
DisplayMemberPath="Term"
SelectedValue="{Binding Path=IDUnit, Mode=TwoWay}"
>
<ComboBox.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel />
</ItemsPanelTemplate>
</ComboBox.ItemsPanel>
</myControl:ComboBox>
</StackPanel>
</dataform:DataField>
</StackPanel>
</DataTemplate>
</dataform:DataForm.EditTemplate>
</dataform:DataForm>
<StackPanel
Orientation="Horizontal"
HorizontalAlignment="Right"
Margin="0,12,0,0">
<Button
Content="Save"
x:Name="SaveChangesButton"
Width="100"
Height="23"
Margin="4,0,4,0"
Command="{Binding SaveCommand}" />
</StackPanel>
</StackPanel>
So, I use MVVM with RIA. For data grid I use MVVM, and for ComboBox data context I use RIA. That is the only way to fill the ComboBox and to bind DataGrid value with ComboBox value, but in the wrong way! When I click Edit in data form, I always get ComboBox initialized to the first item. Of course, value in data grid get the same value (wrong!).
What I am doing wrong?
Thanks!
P.S. I forgot to mention that I have two tables, PhysicalQuantity and Unit, where PhysicalQuantity has one or zero Units (BaseUnit).
Lucky
You're using the wrong ComboBox.
Kyle McClellan has a far more capable ComboBox, which honestly should have been rolled out with the toolkit 2 times over by now, but there seems to be something going fishy with toolkit support as well. Please read more about it here:
http://blogs.msdn.com/b/kylemc/archive/2010/06/18/combobox-sample-for-ria-services.aspx