ورود

View Full Version : سوال: حرکت دادن به Ellipse در Blend



Mahdi-PLus
جمعه 11 اسفند 1391, 18:11 عصر
سلام. من میخوام با کلیک بر روی یک Image (یا همون Picture Box تو سی شارپ!) یه Ellipse که از قبل ساختمش به حرکت در بیاد و به نقطه دیگه ای بره. میخوام این حرکت کنترل شده باشه یعنی وسطای راه شتاب بگیره بعد آخرای راه شتابش کم بشه (سرعتش تو همه طول مسیر یکسان نباشه) چطور باید این کار رو بکنم؟
برای این که منظور خودم رو بهتر برسونم انیمیشن زیر رو هم ساختم. تقریبا میخوام Ellipse هایی که ساختم مثل اون حرکت کنن. نیازمند یاری سبزتان!
ممنون

دانلود انیمیشن (http://uplod.ir/oroa9p2lv2nl/Program_Animation.zip.htm)

ghayour
شنبه 12 اسفند 1391, 17:06 عصر
این کنترل شده‌ای که گفتی رو من بلد نیستم اما این کد رو مثل همین ویدئوای که گذاشتی برات می‌گذارم.
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e1" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-1.5,-2.5 L168.5,-0.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e1" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-1.5,-2.5 L168.5,-0.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e2" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M1,-1.5 C1,-1.5 1,138.48932 1,140"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e2" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M1,-1.5 C1,-1.5 1,138.48932 1,140"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e3" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M169.5,0.5 L-1.5,-1.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e3" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M169.5,0.5 L-1.5,-1.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e4" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-166.5,-0.5 L-168,-141"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e4" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-166.5,-0.5 L-168,-141"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</EventTrigger>
</Window.Triggers>
<Grid Background="Black">
<Path x:Name="_1" Data="M171,77.5 L340,78.5" HorizontalAlignment="Left" Height="2" Margin="171,77.5,0,0" Stretch="Fill" VerticalAlignment="Top" Width="170"/>
<Path x:Name="_2" Data="M340.5,78.5 C340.5,78.5 340.5,217.5 340.5,219" HorizontalAlignment="Left" Height="141.5" Margin="340.5,78.5,0,0" Stretch="Fill" VerticalAlignment="Top" Width="1"/>
<Path x:Name="_3" Data="M341,218.5 L171,217.5" HorizontalAlignment="Left" Height="2" Margin="171,217.5,0,0" Stretch="Fill" VerticalAlignment="Top" Width="171"/>
<Path x:Name="_4" Data="M172,217.5 L171.5,78" HorizontalAlignment="Left" Height="140.5" Margin="171.5,78,0,0" Stretch="Fill" VerticalAlignment="Top" Width="1.5"/>
<Ellipse x:Name="e1" HorizontalAlignment="Left" Height="64" Margin="137,48,0,0" Stroke="Red" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
<Ellipse x:Name="e2" HorizontalAlignment="Left" Height="64" Margin="304,48,0,0" Stroke="White" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
<Ellipse x:Name="e3" HorizontalAlignment="Left" Height="64" Margin="137,187,0,0" Stroke="#FF1EB825" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
<Ellipse x:Name="e4" HorizontalAlignment="Left" Height="64" Margin="304,187,0,0" Stroke="#FF4F5BD3" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
</Window>

ali reza mansoori 2
شنبه 12 اسفند 1391, 18:28 عصر
با نرم افزار blend راحت میتونی این کار رو انجام بدی
بهتره بری آموزش های این نرم افزار رو ببینی

Mahdi-PLus
شنبه 12 اسفند 1391, 19:55 عصر
این کنترل شده‌ای که گفتی رو من بلد نیستم اما این کد رو مثل همین ویدئوای که گذاشتی برات می‌گذارم.
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e1" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-1.5,-2.5 L168.5,-0.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e1" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-1.5,-2.5 L168.5,-0.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e2" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M1,-1.5 C1,-1.5 1,138.48932 1,140"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e2" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M1,-1.5 C1,-1.5 1,138.48932 1,140"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e3" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M169.5,0.5 L-1.5,-1.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e3" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M169.5,0.5 L-1.5,-1.5"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="X" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.X)" Storyboard.TargetName="e4" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-166.5,-0.5 L-168,-141"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
<DoubleAnimationUsingPath Duration="0:0:0.5" Source="Y" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Childr en)[3].(TranslateTransform.Y)" Storyboard.TargetName="e4" BeginTime="0:0:0.5">
<DoubleAnimationUsingPath.PathGeometry>
<PathGeometry Figures="M-166.5,-0.5 L-168,-141"/>
</DoubleAnimationUsingPath.PathGeometry>
</DoubleAnimationUsingPath>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</EventTrigger>
</Window.Triggers>
<Grid Background="Black">
<Path x:Name="_1" Data="M171,77.5 L340,78.5" HorizontalAlignment="Left" Height="2" Margin="171,77.5,0,0" Stretch="Fill" VerticalAlignment="Top" Width="170"/>
<Path x:Name="_2" Data="M340.5,78.5 C340.5,78.5 340.5,217.5 340.5,219" HorizontalAlignment="Left" Height="141.5" Margin="340.5,78.5,0,0" Stretch="Fill" VerticalAlignment="Top" Width="1"/>
<Path x:Name="_3" Data="M341,218.5 L171,217.5" HorizontalAlignment="Left" Height="2" Margin="171,217.5,0,0" Stretch="Fill" VerticalAlignment="Top" Width="171"/>
<Path x:Name="_4" Data="M172,217.5 L171.5,78" HorizontalAlignment="Left" Height="140.5" Margin="171.5,78,0,0" Stretch="Fill" VerticalAlignment="Top" Width="1.5"/>
<Ellipse x:Name="e1" HorizontalAlignment="Left" Height="64" Margin="137,48,0,0" Stroke="Red" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
<Ellipse x:Name="e2" HorizontalAlignment="Left" Height="64" Margin="304,48,0,0" Stroke="White" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
<Ellipse x:Name="e3" HorizontalAlignment="Left" Height="64" Margin="137,187,0,0" Stroke="#FF1EB825" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
<Ellipse x:Name="e4" HorizontalAlignment="Left" Height="64" Margin="304,187,0,0" Stroke="#FF4F5BD3" VerticalAlignment="Top" Width="71" RenderTransformOrigin="0.5,0.5">
<Ellipse.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</Ellipse.RenderTransform>
</Ellipse>
</Grid>
</Window>


من که یک کاربر مبتدی WPF هستم و از کد هاش سر در نمیارم ولی من عینا این کد ها رو کپی کردم ارور داد. راهی نمیشناسین تو خود محیط Blend برای انجام این کار؟؟؟

ghayour
شنبه 12 اسفند 1391, 20:27 عصر
من هم کدهای blend رو برای شما گذاشتم.
اگه در کدهاش دقت کرده باشید در این کد بین حروف فاصله افتاده:
(UIElement.RenderTransf orm)
که درستش به این صورت است:
(UIElement.RenderTransform)
این مورد در چندجا اتفاق افتاده.

ضمنا آموزش ساخت انیمیشن هم هست:
http://barnamenevis.org/showthread.php?251604-%D8%A2%D9%85%D9%88%D8%B2%D8%B4-%D9%88%DB%8C%D8%AF%D8%A6%D9%88%DB%8C%DB%8C-%D9%81%D8%A7%D8%B1%D8%B3%DB%8C-Blend&p=1130698&viewfull=1#post1130698

من با کنترل pen برای هر Ellipse خط کشیدم سپس به همین صورتی که در این آموزش میبینی انیمیشن ایجاد کردم.

بعد از اینکه این کدها رو به blend انتقال دادی اونها رو به همون صورتی که گفتم ویرایش کن درست کار می‌کنه.

Mahdi-PLus
شنبه 12 اسفند 1391, 21:20 عصر
برنامه من خودش کد های زیادی داره. این کد هایی رو که شما میگید رو کجای کد های برنامه خودم بزنم؟ ضمنا سرعت حرکت رو چطور مشخص کنم؟
در ضمن کدی که شما نوشتین مخصوص دوران ساعتگرد هست؛ (یعنی شکل دوم از شکل زیر) حالا من چطور با تغییر کد ها برای همه ی نماد های های زیر برنامه خودم رو تنظیم کنم؟
(در شکل های زیر دایره ها به معنی بی اثر هستن. یعنی هر قسمت که دایره باشه و خط نباشه یعنی تحت تاثیر دوران قرار نمیگیره و کلا تکون نمیخوره! مثلا وقتی در شکل اول هر 4 قسمت دایره هستن یعنی هیچ اتفاقی نمی افته و در شکل آخر برای شکل سمت راست از بالا و سمت چپ از پایین اتفاقی نمیافته و قسمت هایی که تحت دوران قرار میگیرن در شکل آخر شکل اول از بالا و شکل دوم از پایین)
http://axgig.com/images/97260868673918239087.jpg

ghayour
شنبه 12 اسفند 1391, 22:05 عصر
اگه این آموزش رو ندیدید اول ببینید. خودتون جواب سوال هاتون رو پیدا میکنید.

ضمنا آموزش ساخت انیمیشن هم هست:
http://barnamenevis.org/showthread.p...=1#post1130698
ضمنا نحوه‌ی انتقال هر Ellipse رو هم با pen مشخص کردم.

در صورتی که باز هم متوجه نشدید بگید تا فیلم آموزشی براتون درست کنم.

موفق باشید

Mahdi-PLus
دوشنبه 14 اسفند 1391, 10:42 صبح
من این فیلم آموزشی رو داشتم و دیده بودم! اما مشکل من تو کد هاست. کد های برنامه من به شکل زیر هستن:

دانلود (http://uplod.ir/oz3qn0ctkgu3/New_Text_Do_ent.zip.htm)

حالا من کد هایی رو که شما دادین رو کجای این کد ها بزنم؟ در ضمن مثلا من خودم Storyboard1 رو دارم. اگه کد های شما روبزنم با هم قاطی میشن!

البته این رو هم بگم که نیازی به فیلم آموزشی نیست هیمن جا بگین متوجه میشم.

ببینید مشکل اصلی اینجاست که تو محیط بلند نمیتونم خطی رسم کنم که دوسر اون درست مرکز دو دایره باشه. که فکر کنم این کار فقط با کد نویسی میسر باشه. اگه تو محیط بلند میشه خطی کشید که دو سر اون درست مرکز دو دایره باشه اونو بگین همه چی حله.

ghayour
دوشنبه 14 اسفند 1391, 17:19 عصر
چون می‌خواهید دو سر خط ها روی مرکز دایره ها باشه و خط هاتون هم راست باشه بهتره از Line استفاده کنید. خط خودتون رو بکشید*(هنگام کشیدن خط کلید shift رو نگه دارید). سپس Ellipse ها رو ایجاد کنید(با نگه داشتن Shift دایره میشن). همانطور که می‌بینید یک نقطه در مرکز Ellipse ها هست که با کمک اون میتوانید به راحتی در جای مورد نظر قرار بدید. (حتی اگه Ellipse ها رو هم در جای مشخصشون قرار ندید با ایجاد انیمیشن خودشون روی سر خط قرار میگیرن.)

* - این مهمه که خط رو از کدوم طرف می‌کشید.

موفق باشید

فایل zip تون هم اکسترکت نشد

Mahdi-PLus
پنج شنبه 17 اسفند 1391, 12:25 عصر
در حال حال حاظر تنها مشکل من اینه که نمیتونم لاین رو طوری رسم کنم که دو سر اون درست مرکز دو دایره باشه. من اول Ellipse ها رو رسم کردم(به صورت دایره) بعد با گرفتن شیفت لاین رو هم رسم کردم اما نمیتونم دو سر لاین رو روی مرکز دایره ها قرار بدم. چطور این کار رو بکنم؟

ghayour
جمعه 18 اسفند 1391, 22:01 عصر
این آموزش تصویری:
http://rozup.ir/up/ghayour/Video/BlE.mp4

Mahdi-PLus
چهارشنبه 04 اردیبهشت 1392, 20:58 عصر
سلام.
وقتی لاین رو رسم میکنم و Ellipse رو انتخاب میکنم (یا هر چیز دیگه ای) لاین محو میشه! حذف نمیشه ولی نمایش داده میشه! راه حلش چیه؟

Mahdi-PLus
جمعه 06 اردیبهشت 1392, 12:30 عصر
کسی نیست جواب بده!!؟؟

Mahdi-PLus
سه شنبه 10 اردیبهشت 1392, 19:59 عصر
من این سوال رو یک هفته پیش پرسیدم... شایدم بیشتر از یه هفته. اما نمیدونم چرا هیچ کسی جواب نمیده. خواهشا جواب بدید.