2d camera in c# wpf

Question

I know it's not the right choice, but I'm trying to make a game engine in wpf.
and naturally this game engine should have a 2d camera.
Does anyone know how to do this?
I will move it with the right and left arrow keys

Answer 1

Here is an example of how to use ScrollViewer to keep it in the field of view of the "camera". You could try to refer to it
The code of xaml:

<Window x:Class="_2dCameraDemo.MainWindow"  
        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:_2dCameraDemo"  
        mc:Ignorable="d"  
        Title="MainWindow"  
        Loaded="Window_Loaded"  
        SizeToContent="WidthAndHeight"  
        PreviewKeyDown="Window_PreviewKeyDown">  
    <Grid>  
        <ScrollViewer x:Name="CanvasViewer"   HorizontalScrollBarVisibility="Hidden"  VerticalScrollBarVisibility="Hidden">  
            <Canvas x:Name="Canvas"  IsHitTestVisible="False" >  
                <Canvas.Background>  
                    <ImageBrush ImageSource="11.jpg"/>  
                </Canvas.Background>  
            </Canvas>  
        </ScrollViewer>  
    </Grid>  
</Window>  

The code of xaml.cs:

public partial class MainWindow : Window  
  {  
    double _playerSize;  

    Rectangle _playerRect;  
    Vector _playerPosition;  

    public MainWindow()  
    {  
      InitializeComponent();  
    }  
    private void Window_Loaded(object sender, RoutedEventArgs e)  
    {  
      InitializeSizes();  
      InitializePlayerRect();  
    }  
    private void InitializeSizes()  
    {  
      _playerSize = 30;  
      Canvas.Width = 700;  
      Canvas.Height = 700;  

      CanvasViewer.Width = 400;  
      CanvasViewer.Height = 400;  
    }  
    private void InitializePlayerRect()  
    {  
      _playerRect = new Rectangle  
      {  
        Fill = Brushes.LightPink,  
        Width = _playerSize,  
        Height = _playerSize,  
        HorizontalAlignment = HorizontalAlignment.Left,  
        VerticalAlignment = VerticalAlignment.Top  
      };  

      Canvas.Children.Add(_playerRect);  
    }  
    private void Window_PreviewKeyDown(object sender, KeyEventArgs e)  
    {  
      switch (e.Key)  
      {  
        case Key.Left: MovePlayerLeft(); break;  
        case Key.Up: MovePlayerUp(); break;  
        case Key.Right: MovePlayerRight(); break;  
        case Key.Down: MovePlayerDown(); break;  
      }  
    }  
    private void MovePlayerLeft()  
    {  
      var newX = _playerPosition.X - _playerSize;  
      _playerPosition.X = Math.Max(0, newX);  
      UpdatePlayerPositionAndCamera();  
    }  

    private void MovePlayerUp()  
    {  
      var newY = _playerPosition.Y - _playerSize;  
      _playerPosition.Y = Math.Max(0, newY);  
      UpdatePlayerPositionAndCamera();  
    }  

    private void MovePlayerRight()  
    {  
      var newX = _playerPosition.X + _playerSize;  
      _playerPosition.X = Math.Min(Canvas.Width - _playerSize, newX);  
      UpdatePlayerPositionAndCamera();  
    }  
    private void MovePlayerDown()  
    {  
      var newY = _playerPosition.Y + _playerSize;  
     _playerPosition.Y = Math.Min(Canvas.Height - _playerSize, newY);  
      UpdatePlayerPositionAndCamera();  
    }  
    private void UpdatePlayerPositionAndCamera()  
    {  
      UpdatePlayerPosition();  
      UpdateCamera();  
    }  
    private void UpdatePlayerPosition()  
    {  
      _playerRect.Margin = new Thickness(_playerPosition.X, _playerPosition.Y, 0, 0);  
    }  
    private void UpdateCamera()  
    {  
      var offsetX = _playerPosition.X / 2;  
      var offsetY = _playerPosition.Y / 2;  
      CanvasViewer.ScrollToHorizontalOffset(offsetX);  
      CanvasViewer.ScrollToVerticalOffset(offsetY);  
    }  
  }  

The picture of result:

---

If the response is helpful, please click "Accept Answer" and upvote it.
 Note: Please follow the steps in our [documentation][3] to enable e-mail notifications if you want to receive the related email notification for this thread. 

[3]: https://learn.microsoft.com/en-us/answers/articles/67444/email-notifications.html