Access to the canvas inside the ItemsSource element in UserControl, from MainPage

I have a FlipView in my MainPage . It has an ItemTemplate attached to a UserControl called landscapeControl . It ItemsSource tied to a list of class called MyLandscape .

landscapeControl:

 <Grid> <ScrollViewer x:Name="LScrollViewer" MaxZoomFactor="2.0" MinZoomFactor="1.0" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden" DoubleTapped="LScrollViewer_DoubleTapped" > <Canvas x:Name="inkCanvas" Background="Transparent"> <StackPanel x:Name="LStackPanel" Orientation="Horizontal" Margin="0,0,0,0"> <Image x:Name="LImage0" HorizontalAlignment="Right" Source="{Binding firstImage}" Width="570"/> <Image x:Name="LImage1" HorizontalAlignment="Left" Source="{Binding nextImage}" Width="570"/> </StackPanel> </Canvas> </ScrollViewer> </Grid> 

MyLandscape class:

  public class MyLandscape { public ImageSource firstImage { get; set; } public ImageSource nextImage { get; set; } public Canvas inkCanvas { get; set; } } 

My images are displayed perfectly. All I want is 3 things:

1) I want to access my Canvas from my MainPage . I try to do this in the flipView_SelectionChanged event:

  landscapeControl pc = flipView1.SelectedItem as landscapeControl; if (flipView1.Items.Count > 0) { var myCanvas = pc.getCanvas(); m_CanvasManager = new CanvasManager(myCanvas); } 

But the variable p is always null! I want to snap my Canvas , so do I have a Canvas for every two images? Is it possible?

+5
source share
3 answers

One way is to use Command to pass the UIElement back to your model.

Basically your inkCanvas element will be attached to a CanvasLoadedCommand like this. Please note that this command is only called when inkCanvas fully loaded.

  <Canvas x:Name="inkCanvas" Background="Transparent"> <Interactivity:Interaction.Behaviors> <Core:EventTriggerBehavior> <Core:InvokeCommandAction Command="{Binding CanvasLoadedCommand}" CommandParameter="{Binding ElementName=inkCanvas}" /> </Core:EventTriggerBehavior> </Interactivity:Interaction.Behaviors> 

I created a simple DelegateCommand for this little demo (working source code) here. When inkCanvas loads,

this.inkCanvas = (Canvas) canvas;

will be called and then the inkCanvas property will be filled.

  private DelegateCommand _canvasLoadedCommand; public DelegateCommand CanvasLoadedCommand { get { if (_canvasLoadedCommand == null) { _canvasLoadedCommand = new DelegateCommand((canvas) => { this.inkCanvas = (Canvas)canvas; }, (canvas) => canvas != null); } return _canvasLoadedCommand; } } 

Hope this helps!

+1
source

Change your code:

 if (flipView1.Items.Count > 0) { var myCanvas = pc.getCanvas(); m_CanvasManager = new CanvasManager(myCanvas); } 

to

 if (e.AddedItems.Count > 0) { var myCanvas = (e.AddedItems[0] as LandscapeControl).getCanvas(); m_CanvasManager = new CanvasManager(myCanvas); } 
0
source

Well, after a long search in the Windows Store Apps : we cannot access the Canvas that is inside FlipView , either if it is located directly inside FlipView or in the DataTemplate FlipView .

0
source

All Articles