چندلمسی در WPF – آموزش WPF

wpf multi touch 10578 تصویر

چندلمسی در WPF

ویندوز ۷ و نسخه های بالاتر این قابلیت را دارند که از پنل های لمسی ورودی دریافت کنند. WPF زمانی که عملیات لمس رخ می دهد، دو نوع رویداد منتشر می کند که عبارت اند از رویدادهای لمس و رویدادهای دستکاری. رویدادهای لمس اطلاعاتی را در مورد هر انگشت که بر روی صفحه لمسی قرار دارد و نحوه حرکت آن ها ارائه می دهند. رویدادهای دستکاری ورودی را به عنوان اعمال خاصی تفسیر می کنند. به منظور توسعه برنامه ای که از قابلیت لمس پشتیبانی کند باید ابزارهای زیر را داشته باشید.

  • نرم‌افزار Visual Studio 2010 یا نسخه های جدیدتر
  • سیستم عامل ویندوز ۷ یا نسخه های جدیدتر
  • دستگاهی که صفحه لمسی داشته باشد

اصطلاحات پر استفاده در هنگام کار با ورودی صفحه لمسی:

  • Touch: ورودی کاربر که در ویندوز ۷ یا نسخه های جدیدتر قابل شناسایی است. ورودی لمسی از یک صفحه حساس به لمس می آید.
  • Multi Touch: زمانی اتفاق می افتد که به صورت همزمان بیش از یک نقطه بر روی صفحه لمسی لمس شود.
  • Manipulation: زمانی اتفاق می افتد که لمس به عنوان یک عمل فیزیکی اعمال شده بر روی یک شیء در نظر گرفته می شود.
  • Touch Device: دستگاهی که از چیزی مانند یک انگشت بر روی صفحه لمسی، ورودی لمسی تولید می کند.

مثال

برای درک بهتر موارد گفته شده، یک پروژه WPF به نام WPFTouchInput ایجاد کرده و آن را مانند نمونه زیر تغییر دهید.

محتوای فایل MainWindow.xaml:

<Window x:Class = "WPFMultiTouchInput.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:WPFMultiTouchInput" 
   mc:Ignorable = "d" Title = "MainWindow" Height = "350" Width = "604"> 
	
   <Window.Resources> 
      <MatrixTransform x:Key = "InitialMatrixTransform"> 
         <MatrixTransform.Matrix> 
            <Matrix OffsetX = "200" OffsetY = "200"/> 
         </MatrixTransform.Matrix> 
      </MatrixTransform> 
   </Window.Resources> 
	
   <Canvas> 
      <Rectangle Name = "manRect" Width = "321" Height = "241"  
         RenderTransform = "{StaticResource InitialMatrixTransform}" 
         IsManipulationEnabled = "true" Canvas.Left = "-70" Canvas.Top = "-170">
         <Rectangle.Fill> 
            <ImageBrush ImageSource = "Images/DSC_0076.JPG"/> 
         </Rectangle.Fill> 
      </Rectangle> 
   </Canvas>
	
</Window>

محتوای فایل MainWindow.xaml.cs:

using System.Windows; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Shapes; 
 
namespace WPFMultiTouchInput { 

   public partial class MainWindow : Window {
	
      public MainWindow() { 
         InitializeComponent(); 
      } 
		
      void Window_ManipulationStarting(object sender, ManipulationStartingEventArgs e) { 
         e.ManipulationContainer = this; 
         e.Handled = true; 
      } 
		
      void Window_ManipulationDelta(object sender, ManipulationDeltaEventArgs e) { 
         Rectangle rectToMove = e.OriginalSource as Rectangle; 
         Matrix rectsMatrix = ((MatrixTransform)rectToMove.RenderTransform).Matrix;
			
         rectsMatrix.RotateAt(e.DeltaManipulation.Rotation, e.ManipulationOrigin.X, e.ManipulationOrigin.Y); 
			
         rectsMatrix.ScaleAt(e.DeltaManipulation.Scale.X, e.DeltaManipulation.Scale.X, 
            e.ManipulationOrigin.X, e.ManipulationOrigin.Y); 
				
         rectsMatrix.Translate(e.DeltaManipulation.Translation.X,
            e.DeltaManipulation.Translation.Y);
				
         rectToMove.RenderTransform = new MatrixTransform(rectsMatrix);  
         Rect containingRect = new Rect(((FrameworkElement)e.ManipulationContainer).RenderSize); 
			
         Rect shapeBounds = rectToMove.RenderTransform.TransformBounds(new Rect(rectToMove.RenderSize));  
			
         if (e.IsInertial && !containingRect.Contains(shapeBounds)) { 
            e.Complete(); 
         } 
			
         e.Handled = true; 
      } 
		
      void Window_InertiaStarting(object sender, ManipulationInertiaStartingEventArgs e) { 
         e.TranslationBehavior.DesiredDeceleration = 10.0 * 96.0 / (1000.0 * 1000.0); 
         e.ExpansionBehavior.DesiredDeceleration = 0.1 * 96 / (1000.0 * 1000.0); 
         e.RotationBehavior.DesiredDeceleration = 720 / (1000.0 * 1000.0); 
         e.Handled = true; 
      } 	
   } 
}

زمانی که مثال فوق را کامپایل و اجرا کنید، خروجی زیر را تولید خواهد کرد:

wpf multi touch 10578 1 تصویر

حالا شما می توانید با انگشتان خود بر روی تصویر زوم کرده یا آن را بچرخانید (البته اگر صفحه لمسی داشته باشید).

نوشته چندلمسی در WPF – آموزش WPF اولین بار در سورس سرا - آموزش برنامه نویسی. پدیدار شد.

درباره نویسنده: administrator

ممکن است دوست داشته باشید

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *