Page Index Toggle Pages: 1 Send TopicPrint
Normal Topic Creating a node with a button MVVM (Read 4456 times)
bobanee
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 4
Joined: Mar 25th, 2019
Creating a node with a button MVVM
Mar 25th, 2019 at 1:41pm
Print Post  
Hey, so i created a diagram:
<diag:Diagram x:Name="flowchart" >
I wuld like to add a node with a button click this way:
flowchart.Items.Add(new ShapeNode { Shape = Shapes.RoundRect, Bounds = new System.Windows.Rect(0, 0, 40, 40) });

I think I must create a diagram in my viewmodel.
Im kinda new to C#, mvvm etc. so I guess it shuld be a basic thing what I'm missing.
  
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3445
Joined: Oct 19th, 2005
Re: Creating a node with a button MVVM
Reply #1 - Mar 25th, 2019 at 3:18pm
Print Post  
Hi,

Doesn't that flowchart.Items.Add line show the node? I guess the diagram is mostly part of the view, but the viewmodel adds items to the diagram while adapting the model to view, if that makes sense Smiley You could also use the class from https://mindfusion.eu/Forum/YaBB.pl?num=1306412889/1#1 to bind to a collection of yours.

Regards,
Slavcho
Mindfusion
  
Back to top
 
IP Logged
 
bobanee
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 4
Joined: Mar 25th, 2019
Re: Creating a node with a button MVVM
Reply #2 - Mar 26th, 2019 at 11:09am
Print Post  
When I move the mouse over flowchart I get that error:
"The name 'flowchart' does not exist in the current contex."

As you said diagram is part of view and viewmodel adds items.
I'm using caliburn micro framework, maybe because in my viewmodel class I inherit from Screen (public class MainViewModel : Screen) I get that error.

Thanx for the link, I will need it when I make it work  Smiley.
  
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3445
Joined: Oct 19th, 2005
Re: Creating a node with a button MVVM
Reply #3 - Mar 26th, 2019 at 12:16pm
Print Post  
Could you attach a test project showing your setup?

Regards,
Slavcho
  
Back to top
 
IP Logged
 
bobanee
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 4
Joined: Mar 25th, 2019
Re: Creating a node with a button MVVM
Reply #4 - Mar 26th, 2019 at 1:53pm
Print Post  
View
Code
Select All
<Window x:Class="mindfusionTest.Views.ShellView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:mindfusionTest.Views"
        xmlns:diag="http://mindfusion.eu/diagramming/wpf"
        mc:Ignorable="d"
        Title="ShellView" Height="450" Width="800">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="20"/>
            <ColumnDefinition Width="auto"/>
            <ColumnDefinition Width="auto"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="20"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="20"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="20"/>
        </Grid.RowDefinitions>

        <Button x:Name="InsertNode" Grid.Row="1" Grid.Column="1" Width="50" Height="20">Insert</Button>

        <diag:Diagram x:Name="flowchart" Behavior="DrawLinks" Grid.Row="1" Grid.Column="2" Grid.ColumnSpan="2" Grid.RowSpan="3" ></diag:Diagram>

        <TextBlock x:Name="TextIt" Grid.Column="2" Grid.Row="0" Grid.ColumnSpan="2"></TextBlock>
    </Grid>
</Window>
 



View Model
Code
Select All
using Caliburn.Micro;
using MindFusion.Diagramming.Wpf;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace mindfusionTest.ViewModels
{
    class ShellViewModel : Screen
    {
        private string _textIt;

        public string TextIt
        {
            get { return _textIt; }
            set
            { _textIt = value;
                NotifyOfPropertyChange(() => TextIt);
            }
        }

        public void InsertNode()
        {
            flowchart.Items.Add(new ShapeNode { Shape = Shapes.RoundRect, Bounds = new System.Windows.Rect(0, 0, 40, 40) });
            TextIt = "Button Works!";
        }
    }
}
 



part of caliburn micro "start"
app.xaml
Code
Select All
<Application x:Class="mindfusionTest.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:mindfusionTest">

    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary>
                    <local:Bootstrapper x:Key="Bootstrapper"/>
                </ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application> 



Bootstrapper.cs
Code
Select All
using Caliburn.Micro;
using mindfusionTest.ViewModels;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;

namespace mindfusionTest
{
    class Bootstrapper : BootstrapperBase
    {
        public Bootstrapper()
        {
            Initialize();
        }

        protected override void OnStartup(object sender, StartupEventArgs e)
        {
            DisplayRootViewFor<ShellViewModel>();
        }
    }
} 

  
Back to top
 
IP Logged
 
Slavcho
YaBB Moderator
*****
Offline


tech.support

Posts: 3445
Joined: Oct 19th, 2005
Re: Creating a node with a button MVVM
Reply #5 - Mar 26th, 2019 at 2:05pm
Print Post  
Attached project works in our test; with your code access should look like -

Code
Select All
var view = GetView() as Window;
var flowchart = (view.Content as ShellView).flowchart; 



Our developer's not sure if that's expected way to use the framework, we haven't heard of it before Smiley

Regards,
Slavcho
  

CaliburnDiagram.zip (Attachment deleted)
Back to top
 
IP Logged
 
bobanee
YaBB Newbies
*
Offline


I Love MindFusion!

Posts: 4
Joined: Mar 25th, 2019
Re: Creating a node with a button MVVM
Reply #6 - Mar 27th, 2019 at 11:01am
Print Post  
Thanx for your help!
Actualy Your developer used a ContentControl instead of a Window (in my case) so the line shuld be:

Code
Select All
var view = GetView() as Window;
var flowchart = (view as ShellView).flowchart;  



So look like, that my problem was more of a caliburn.micro "problem" than mindfusion... thanks again  Grin
  
Back to top
 
IP Logged
 
Page Index Toggle Pages: 1
Send TopicPrint