Re: Databinding a ListBox using MVVM light (Windows Phone) - WPF Discussion Boards

sthotakura20-May-13 0:45

20-May-13 0:45

Hi,

I have always used MVVM with all the WPF projects I worked on. Recently I joined a firm where they seem to be using MVVMP pattern (http://www.overroot.com/blog/2011/03/16/how-to-implement-mvvmp-pattern/[^]). Whatever Google search I make around I MVVMP I am ending up at the blog mentioned above. I want to understand does any one else use MVVMP too? If so I want to understand the advantages of MVVMP over MVVM. Any links/references to the topic would be greatly appreciated.

Thanks!

Cheers,
Suresh

Re: MVVM vs. MVVMP

SledgeHammer0120-May-13 5:01

SledgeHammer01

20-May-13 5:01

Just something some random dude on the internet made up when he was high. The blog you linked to makes almost no sense. His explanation of why MVVMP is better then MVVM is pretty much "its cooler if you split out your business logic into a separate class from the VM". Well, too bad that's really the models job Smile | :)

Re: MVVM vs. MVVMP

Abhinav S24-May-13 22:11

Abhinav S

24-May-13 22:11

This pattern may be something they are looking at internally.
Stick to MVVM unless you find tons of material on MVVMP.

WP Apps - Color Search | Arctic | XKCD | Sound Meter | Speed Dial

Databinding a ListBox using MVVM light (Windows Phone)

jockey4her19-May-13 12:30

jockey4her

19-May-13 12:30

Using the default MVVM light project for Windows Phone, I tried to implement a databinding to a ListBox. Unsuccessfully. The same CS code, placed in the normal code behind seems to bind just fine. But over in the view model, I get nothing but a blank box.

HTML

<ListBox x:Name="myListBox" HorizontalAlignment="Left" Height="100"
     VerticalAlignment="Top" Width="200">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <ItemsControl ItemsSource="{Binding theList}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Width="auto">
                            <TextBlock Text="{Binding Path=Key}" />
                            <TextBlock Text="{Binding Path=Value}" />
                        </StackPanel>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

public Dictionary<string, string> theDictionary;
private List<Dictionary<string, string>> _theList;
public const string theListPropertyName = "theList";
public List<Dictionary<string, string>> theList
{
    get
    {
        return _theList;
    }
    set
    {
        if (_theList == value)
            return;
        _theList = value;
        RaisePropertyChanged(theListPropertyName);
    }
}
public MainViewModel(IDataService dataService)
{
    List<Dictionary<string, string>> x = new List<Dictionary<string, string>>();
    theDictionary = new Dictionary<string, string>();
    theDictionary.Add("1", "A");
    theDictionary.Add("2", "B");
    theList = new List<Dictionary<string, string>>();
    theList.Add(theDictionary);

}

Re: Databinding a ListBox using MVVM light (Windows Phone)

AlphaDeltaTheta19-May-13 14:51

AlphaDeltaTheta

19-May-13 14:51

Set the items source property of the listbox to your list ("theList") not the items source property of item template.

XML

<ListBox x:Name="myListBox" HorizontalAlignment="Left" Height="100" ItemsSource="{Binding theList}" VerticalAlignment="Top" Width="200">

Re: Databinding a ListBox using MVVM light (Windows Phone)

jockey4her19-May-13 15:42

jockey4her

19-May-13 15:42

Thanks Amitosh, but I think there must be more to it.

I still don't see any data from the ViewModel with an additional ItemsSource={"Binding theList"} on the listbox declaration.

Maybe this is useful: I pulled a reference to the ViewModel in the code behind. I manually assigned myListBox.ItemsSource=vm.theList, and the data appeared!

As to why the one bound through MVVM doesn't work, still a mystery.

modified 19-May-13 21:55pm.

Re: Databinding a ListBox using MVVM light (Windows Phone)

AlphaDeltaTheta19-May-13 16:08

AlphaDeltaTheta

19-May-13 16:08

I agree, I took me a week to understand MVVM architecture, yet not perfectly. I still get weird errors! Confused | :confused:

Where did you initialize the view model in the code behind or xaml?
Viewmodel should be set as the data context of the root element (window,page,usercontrol... etc).

Re: Databinding a ListBox using MVVM light (Windows Phone)

jockey4her19-May-13 17:07

jockey4her

19-May-13 17:07

Thanks Amitosh, yeah I agree with you. Not obvious how it works.

Here is the complete code. It is the default project that the template generates.
You can see my test case in the code behind. When I run it, I only see the data from the code
behind, not the view model.

XAML
http://pastebin.com/n6LbfAdk[^]

VIEWMODEL.cs
http://pastebin.com/uvh2sNv9[^]

MAINPAGE.cs
http://pastebin.com/dQadjL7T[^]

Re: Databinding a ListBox using MVVM light (Windows Phone)

AlphaDeltaTheta20-May-13 15:08

AlphaDeltaTheta

20-May-13 15:08

Ok, I had a look into your code...
You have got the following errors

--In MainViewModel.cs--
Line 42,43 - reference to _welcomeTitle. That should be _theText

Line 47,48 - You have used Dictionary. Binding to a Dictionary doesn't update the view if any value is changed. Get a ObservableDictionary. Unfortunately C# doesn't have such functionality, so google for it.

Line 49,50 - You have used List, Binding to a List doesn't update the view if any value is changed. Use ObservableCollection. It's part of System.Collections.ObjectModel
-----------------------

Now remove all code-behind and see if it works. Also remove the ItemsSource property of the ItemsControl at Line 50. MainPage.xaml

Please consider: Is it necessary to use a dictionary?? It is difficult to bind to a dictionary, you might have possible errors ahead!!

Good Luck!

WPF datagrid text alignment in columns

elelont216-May-13 23:53

elelont2

16-May-13 23:53

Hi,
i have a datagrid implemented in xaml like this:

HTML

<DataGrid ItemsSource="{Binding Stuff}" HeadersVisibility="None" GridLinesVisibility="None" AutoGenerateColumns="True" Height="500" Margin="72,363,72,-3" Name="myGrid" VerticalAlignment="Top" Background="{x:Null}" RowBackground="{x:Null}" CanUserAddRows="True" FontSize="20" /><pre lang="xml">

The grid is automatically populated (via a Binding) with two columns and some data. All is well but the text in the columns is left-aligned.

Is it possible to force the text in one of the autogenerated columns to be right-aligned?

Regards

Re: WPF datagrid text alignment in columns

Pete O'Hanlon17-May-13 0:33

Pete O'Hanlon

17-May-13 0:33

You should be able to do this by applying a style to the DataGridColumnHeader. Off the top of my head, the following should do it:

XML

<Style TargetType="{x:Type DataGridColumnHeader}">
  <Setter Property="ContentTemplate">
    <Setter.Value>
      <DataTemplate>
        <TextBlock Text="{Binding}" HorizontalAlignment="Right" />
      </DataTemplate>
    </Setter.Value>
  </Setter>
</Style>

I was brought up to respect my elders. I don't respect many people nowadays.

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

Re: WPF datagrid text alignment in columns

elelont217-May-13 2:16

elelont2

17-May-13 2:16

Hi and thanks for the reply.

Unfortunately that did not do the trick. The column headers are hidden so i do not need to right-align them.

Basically the datagrid has two columns of data. I need the DATA in ONE of the columns to be right aligned.

I tried this:

HTML

<Style TargetType="DataGrid">
       <Setter Property="CellStyle">
           <Setter.Value>
               <Style TargetType="DataGridCell">
                   <Setter Property="HorizontalAlignment" Value="Right"/>
               </Style>
           </Setter.Value>
       </Setter>
   </Style>

but that just plain righ-aligns everything in the datagrid (data in column 1 and in column 2). Is it possible to apply this to column 2 only?

Note that i do not have the column definitions in my xaml since the datagrid is populated via a binding.

Thanks

Re: WPF datagrid text alignment in columns

Pete O'Hanlon17-May-13 2:31

Pete O'Hanlon

17-May-13 2:31

You can use the AutoGeneratingColumn event to handle this. Source[^].

I was brought up to respect my elders. I don't respect many people nowadays.

CodeStash - Online Snippet Management | My blog | MoXAML PowerToys | Mole 2010 - debugging made easier

New Table to an existing Silverlight project

picasso216-May-13 19:36

picasso2

16-May-13 19:36

I have created a SilverLight application that uses ADO and DomainServices to populate a DataGrid from an SQL 2008 database server. The context looks like this

EcDomainContext context1 = new EcDomainContext();

A few months later, I added a table to the database so in order to use this new table, I had to rebuild as follows:

-deleted all MyDomainServices (.cs) files
-deleted the Mymodel (.edmx) file
-recreate by adding the ADO and Domainservices again
-reconfigure the MyDomainServices.cs as before.

Well, I just added another table and I would like to know if there is an easier way to do this?

Many thanks.
Ps

WPF motion path animation on controls

usmankai16-May-13 14:10

usmankai

16-May-13 14:10

hi i have made the stickin which i am moving a small box around it using motion path. but when i change the angle of that stick through slider, the box movement "animation" still remains same the original path which i set the default. is there any way i can change its animation by depending on its angle.

HTML

Must compile XAML file that specifies events

Neo1010115-May-13 23:29

Neo10101

15-May-13 23:29

When working with a XAML file in conjunction with JavaScript and HTML in VisualStudio, whenever I try to set the Loaded attribute in my Grid, my XAML page will fail to load. I get a blank screen and when I right click somewhere in the page, I see a little box saying 'Silverlight'. The JavaScript will also fail to execute.

I get the following message when I try to open the page in Internet Explorer: "Must compile XAML that specifies events".

Surprisingly, the other XAML page (Speeds.xaml) I have does not fail to execute the JS nor the XAML. It runs properly.

Failing XAML file (Accuracy.xaml):

XML

<?xml version="1.0" encoding="UTF-8"?>
<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      
      Loaded="onLoaded">
  <Grid.RowDefinitions>
    <RowDefinition Height="20*" />
    <RowDefinition Height="60*" />
    <RowDefinition Height="20*" />
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="20*" />
    <ColumnDefinition Width="60*" />
    <ColumnDefinition Width="20*" />
  </Grid.ColumnDefinitions>
  <Grid.Background>
    <LinearGradientBrush>
      <GradientStop Color="#FF3B596E" />
      <GradientStop Color="#FF93C5E8" Offset="1" />
    </LinearGradientBrush>
  </Grid.Background>
  <Canvas Grid.Row="1" Grid.Column="1">
    <Canvas.Background>
      <LinearGradientBrush>
        <GradientStop Color="#FF93C5E8" />
        <GradientStop Color="#FF3B596E" Offset="1" />
      </LinearGradientBrush>
    </Canvas.Background>
    <TextBlock Foreground="Ivory" FontSize="16" Canvas.Left="369.68" Canvas.Top="22.29017076">Accuracy</TextBlock>
    
    <Border Width="103.03999999999999" Canvas.Left="103.03999999999999" Canvas.Top="75.76162307999999" BorderThickness="2" BorderBrush="Red" Height="26.73572616">
      <TextBlock Text="Sum 1-20" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Border>
    <Border Width="103.03999999999999" Canvas.Left="357.6" Canvas.Top="75.76162307999999" BorderThickness="2" BorderBrush="Red" Height="26.73572616">
      <TextBlock Text="Sum 21-40" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Border>
    <Border Width="103.03999999999999" Canvas.Left="612.1600000000001" Canvas.Top="75.76162307999999" BorderThickness="2" BorderBrush="Red" Height="26.73572616">
      <TextBlock Text="Sum 41-60" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Border>
    <Line X1="48.480000000000004" Y1="154.9844" X2="758.24" Y2="154.9844" StrokeThickness="2" Stroke="Red" />
    <Line X1="48.480000000000004" Y1="154.9844" X2="48.480000000000004" Y2="333.6304" StrokeThickness="2" Stroke="Red" />
    <Line X1="48.480000000000004" Y1="200.5612596" X2="758.24" Y2="200.5612596" StrokeThickness="1" Stroke="Red" />
    <Line X1="48.480000000000004" Y1="245.1381192" X2="758.24" Y2="245.1381192" StrokeThickness="1" Stroke="Red" />
    <Line X1="48.480000000000004" Y1="289.7149788" X2="758.24" Y2="289.7149788" StrokeThickness="1" Stroke="Red" />
    <Line X1="48.480000000000004" Y1="334.29183839999996" X2="758.24" Y2="334.29183839999996" StrokeThickness="1" Stroke="Red" />
    <Border Canvas.Left="24.240000000000002" Canvas.Top="148.42759999999998" Width="15" HorizontalAlignment="Center">
      <TextBlock Text="0" Foreground="Ivory" HorizontalAlignment="Center" />
    </Border>
    <Border Canvas.Left="24.240000000000002" Canvas.Top="193.0044596" Width="15" HorizontalAlignment="Center">
      <TextBlock Text="5" Foreground="Ivory" HorizontalAlignment="Center" />
    </Border>
    <Border Canvas.Left="24.240000000000002" Canvas.Top="237.5813192" Width="15" HorizontalAlignment="Center">
      <TextBlock Text="10" Foreground="Ivory" HorizontalAlignment="Center" />
    </Border>
    <Border Canvas.Left="24.240000000000002" Canvas.Top="282.1581788" Width="15" HorizontalAlignment="Center">
      <TextBlock Text="15" Foreground="Ivory" HorizontalAlignment="Center" />
    </Border>
    <Border Canvas.Left="24.240000000000002" Canvas.Top="326.73503839999995" Width="15" HorizontalAlignment="Center">
      <TextBlock Text="20" Foreground="Ivory" HorizontalAlignment="Center" />
    </Border>
    <Border Canvas.Left="96.88" Canvas.Top="154.9844" Border.Background="#FF0093DD" Width="30.320000000000004" Height="116.1199" Visibility="Collapsed" x:Name="bar0" MouseLeftButtonUp="test">
      <TextBlock Text="13" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="145.35999999999999" Canvas.Top="154.9844" Border.Background="#FF29166F" Width="30.320000000000004" Height="35.7292" Visibility="Collapsed" x:Name="bar1" MouseLeftButtonUp="test">
      <TextBlock Text="4" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="193.84" Canvas.Top="154.9844" Border.Background="#FF830F0F" Width="30.320000000000004" Height="26.7969" Visibility="Collapsed" x:Name="bar2" MouseLeftButtonUp="test">
      <TextBlock Text="3" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="345.36" Canvas.Top="154.9844" Border.Background="#FF0093DD" Width="30.320000000000004" Height="53.5938" Visibility="Collapsed" x:Name="bar3" MouseLeftButtonUp="test">
      <TextBlock Text="6" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="393.84000000000003" Canvas.Top="154.9844" Border.Background="#FF29166F" Width="30.320000000000004" Height="80.3907" Visibility="Collapsed" x:Name="bar4" MouseLeftButtonUp="test">
      <TextBlock Text="9" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="442.32" Canvas.Top="154.9844" Border.Background="#FF830F0F" Width="30.320000000000004" Height="44.6615" Visibility="Collapsed" x:Name="bar5" MouseLeftButtonUp="test">
      <TextBlock Text="5" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="593.84" Canvas.Top="154.9844" Border.Background="#FF0093DD" Width="30.320000000000004" Height="107.1876" Visibility="Collapsed" x:Name="bar6" MouseLeftButtonUp="test">
      <TextBlock Text="12" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="642.32" Canvas.Top="154.9844" Border.Background="#FF29166F" Width="30.320000000000004" Height="26.7969" Visibility="Collapsed" x:Name="bar7" MouseLeftButtonUp="test">
      <TextBlock Text="3" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
        <Border Canvas.Left="690.8000000000001" Canvas.Top="154.9844" Border.Background="#FF830F0F" Width="30.320000000000004" Height="44.6615" Visibility="Collapsed" x:Name="bar8" MouseLeftButtonUp="test">
      <TextBlock Text="5" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Bottom" />
    </Border>
    <Border Canvas.Left="96.96000000000001" Canvas.Top="378.87690204" Border.Background="#FF0093DD" Width="200.0" Height="31.19970204">
      <TextBlock Text="N° of correct responses" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Border>
    <Border Canvas.Left="296.96000000000004" Canvas.Top="378.87690204" Border.Background="#FF29166F" Width="200.0" Height="31.19970204">
      <TextBlock Text="N° of incorrect responses" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Border>
    <Border Canvas.Left="496.96000000000004" Canvas.Top="378.87690204" Border.Background="#FF830F0F" Width="200.0" Height="31.19970204">
      <TextBlock Text="N° of no responses" Foreground="Ivory" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Border>
  </Canvas>
</Grid>

Working XAML (Speeds.xaml):

XML

<?xml version="1.0" encoding="UTF-8"?>
<Grid
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    Loaded="onLoaded">
</Grid>

Why is this happening and how can I fix this?

modified 16-May-13 5:42am.

Re: Must compile XAML file that specifies events

AlphaDeltaTheta18-May-13 16:42

AlphaDeltaTheta

18-May-13 16:42

Yes you have the answer, you must compile XAML to BAML in order to use events!
This is what that is done while compiling an app in visual studio. I guess you are trying with an XAML browser project??

Re: Must compile XAML file that specifies events

Neo1010119-May-13 4:23

Neo10101

19-May-13 4:23

No, I do not have the answer. The problem is not 'Must compile XAML that specifies events'.

The problem is that Visual Studio does not accept XAML files that have Elements whose Background property is set. On my machine it is not compatible with the Background property for some reason. After I set any Background property on my XAML page and I run my project, Visual Studio will show a white page in my Accuracy.html. Everything is white. No content. I am trying to understand why Visual Studio does not accept this Background property.

Re: Must compile XAML file that specifies events

AlphaDeltaTheta19-May-13 14:48

AlphaDeltaTheta

19-May-13 14:48

Strange?? I do files with a great deal of backgrounds with fancy gradients, images... designed with blend of course??
Well mine is vs2012? yours??

Is Frame is a good Control for loading a Xaml page in WPF?

Mohammed Hameed14-May-13 19:53

Mohammed Hameed

14-May-13 19:53

Hi,
Is this okay to use Frame control in my Main window to load a Xaml page at Runtime?
It also has to support drag/drop feature so that users can drag a control from Toolbox of Main window to the Xaml page in the Frame.

Please suggest/explain.

Thanks.

Be a good professional who shares programming secrets with others.

Re: Is Frame is a good Control for loading a Xaml page in WPF?

Abhinav S15-May-13 8:12

Abhinav S

15-May-13 8:12

You can directly load the view into the user control.

WP Apps - Color Search | Arctic | XKCD | Sound Meter | Speed Dial

Re: Is Frame is a good Control for loading a Xaml page in WPF?

Mohammed Hameed15-May-13 19:28

Mohammed Hameed

15-May-13 19:28

Whether user control supports drag/drop?

Be a good professional who shares programming secrets with others.

TreeViewDragDropTarget Drag Certain Node Only

Member 1003315714-May-13 19:52

Member 10033157

14-May-13 19:52

Hi, I have a treeview where the nodes are generated on runtime.

I want to drag the child node into a canvas a generate an image for each node.

My scenario is i want to allow only certain node to be able to drag and only allow dragging when user want to edit the canvas. How should i achieve that?

Currently I'm using the Silverlight Toolkit TreeViewDragDropTarget.

WPF / MVVM Get Data From ViewModel

Kevin Marois14-May-13 15:10

Kevin Marois

14-May-13 15:10

I have been working on a project that uses user controls inside other views. What I still can't figure out is how to get a reference to the user control's ViewModel so I can get data off of it or write data to it.

So far, I have been getting a reference to the user control, then getting the VM as the DataContext, then accessing it through that refereence. But this doesn't seem to be right.

In another project I'm using a factory pattern in my AppResources.XAML, such as:

<DataTemplate DataType="{x:Type vm:ClientCenterViewModel}">
    <vw:ClientCenterView/>
</DataTemplate>

This does a nice job of pairing the VM to the View, but I can't get a reference to the view's VM to read/write to it.

What's the right way to do this?

Thanks

If it's not broken, fix it until it is

Re: WPF / MVVM Get Data From ViewModel

SledgeHammer0115-May-13 6:57

SledgeHammer01

15-May-13 6:57

You shouldn't need to have access to a child controls VM directly. It's all done via data binding.

<Window>
<Grid>
<MyChildView SomeProp="{Binding SomeProp}" />
</Grid>
</Window>

If you are using DataTemplates to map views <-> VMs, you also don't need access to the VM directly because those views should operate on thier own VMs which would talk to the persistance layer directly.

If you are finding that you need to access a child control/view to do stuff from the code behind, its probably because you didn't expose that functionality with a bindable property. If you don't own the code of the child view, you can expose the functionality you need with a bindable attached behavior.

Last Visit: 31-Dec-99 18:00 Last Update: 20-May-24 13:03

Refresh

ᐊ Prev 1...121 122 123 124125126 127 128 129 130 Next ᐅ

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.