آموزش Angular: انیمیشن ها

Angular: Animations

نکته: آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
توضیحات دوره: Motion کلید برنامه های مدرن وب است. زاویه دار آماده است قابلیت های انیمیشن بومی این کتابخانه محبوب جاوا اسکریپت را کاوش کرده و برنامه های گویا بسازید. این دوره مبتنی بر پروژه از Angular CLI و ماژول انیمیشن های آن برای ایجاد و متحرک سازی نسخه نمایشی تعاملی استفاده می کند. نحوه تنظیم پارامترهایی مانند مدت زمان ، تأخیر ، کاهش و بازگشت تماس را بیابید ، که به شما امکان می دهد زمان و ترتیب انیمیشن خود را تنظیم کنید. مربی Joseph Labrecque همچنین نشان می دهد که چگونه می توان عناصر جدا شده برنامه خود را با استفاده از توابع پرس و جو و متحرک متحرک کرد. هنگامی که می فهمید چگونه یک پروژه جدید را متحرک کنید ، جوزف شما را در روند متحرک سازی تعاملات درون یک برنامه موجود Angular - یک پخش کننده ویدیوی سفارشی ، هدایت می کند. سرانجام ، نحوه تدوین و بسته بندی پروژه برای توزیع در وب را کشف کنید.
موضوعات شامل:
  • نصب Angular CLI
  • ایجاد یک پروژه جدید
  • تأیید بسته انیمیشن ها
  • پیکربندی مسیرهای پروژه
  • اجزای متحرک
  • ایجاد انیمیشن بین حالتها
  • انیمیشن پله ای و موازی
  • نوشتن انیمیشن های قابل استفاده مجدد
  • متحرک کردن موارد منفرد با سeryال و تکان دادن
  • متحرک سازی یک پروژه Angular موجود

سرفصل ها و درس ها

مقدمه Introduction

  • خوش آمدی Welcome

  • آنچه قبل از گذراندن این دوره باید بدانید What you should know before taking this course

  • با استفاده از پرونده های تمرینی Using the exercise files

  • چه جدید در این به روز رسانی What's new in this update

1. آماده شدن برای تحریک کردن 1. Getting Ready to Animate

  • انیمیشن های زاویه دار چگونه کار می کنند How Angular animations work

  • نصب زاویه ای CLI Angular CLI Installation

  • ایجاد یک پروژه جدید Creating a new project

  • ساختار پروژه Project structure

  • پیش نمایش پروژه Preview the project

  • چالش: نسخه Angular خود را به روز کنید Challenge: Update your Angular version

  • راه حل: نسخه Angular خود را به روز کنید Solution: Update your Angular version

2. فعال کردن انیمیشن های زاویه ای 2. Enabling Angular Animations

  • در حال تأیید بسته انیمیشن ها Verifying the animations package

  • پیکربندی ماژول پروژه Project module configuration

  • طرح بندی Application layout

  • ایجاد م componentsلفه های مشاهده مسیر Creating route view components

  • پیکربندی مسیرهای پروژه Configuring project routes

  • چالش: یک نمای مسیر 404 ایجاد کنید Challenge: Create a 404 route view

  • راه حل: یک نمای مسیر 404 ایجاد کنید Solution: Create a 404 route view

3. مبانی انیمیشن زاویه ای 3. Angular Animation Basics

  • آماده سازی تعامل م componentلفه ها Preparing component interaction

  • ایجاد داده های دولتی Establishing stateful data

  • ایجاد انیمیشن بین ایالت ها Triggering animation between states

  • تاخیر و کاهش عملکردها Delay and easing functions

  • انیمیشن مرحله ای با فریم های کلیدی Stepped animation with keyframes

  • انیمیشن موازی با گروه ها Parallel animation with groups

  • توابع تماس با انیمیشن Animation callback functions

  • چالش: متن پیام را پاک کنید Challenge: Clear the message text

  • راه حل: متن پیام را پاک کنید Solution: Clear the message text

4. انیمیشن پیشرفته زاویه ای 4. Advanced Angular Animation

  • انیمیشن م componentلفه خودمختار Self-contained component animation

  • نوشتن انیمیشن های قابل استفاده مجدد Writing reusable animations

  • پارامترهای ورودی انیمیشن Animation input parameters

  • پیکربندی انیمیشن روتر Configuring router animation

  • انتخاب موارد با پرس و جو Selecting items with a query

  • استفاده از Stagger در یک انیمیشن Using Stagger within an animation

  • چالش: انیمیشن های صفحه ای روتر Challenge: Per-page router animations

  • راه حل: انیمیشن های روتر در هر صفحه Solution: Per-page router animations

5- متحرک کردن یک رابط موجود 5. Animating an Existing Interface

  • نمای کلی پخش فیلم Video playback overview

  • افزودن بسته های انیمیشن Adding animation packages

  • پاکسازی انیمیشن قدیمی Old animation cleanup

  • ایجاد م Angلفه های Angular Creating Angular components

  • فوری سازی م Compلفه و ترجمه مقدار داده Component instantiation and data value translation

  • متحرک سازی عنوان ویدیو Animating the video title

  • متحرک کردن پوشش پخش Animating the playback overlay

  • ارائه حرکت لیست پخش Providing playlist motion

  • چالش: انتقال نوار ابزار با محو شدن Challenge: Transition the toolbar with a fade

  • راه حل: نوار ابزار را با محو شدن تغییر دهید Solution: Transition the toolbar with a fade

6. بسته بندی برای توزیع 6. Package for Distribution

  • ساخت پروژه Building the project

نتیجه Conclusion

  • خداحافظ Goodbye

نمایش نظرات

Linkedin (لینکدین)

لینکدین: شبکه اجتماعی حرفه‌ای برای ارتباط و کارآفرینی

لینکدین به عنوان یکی از بزرگترین شبکه‌های اجتماعی حرفه‌ای، به میلیون‌ها افراد در سراسر جهان این امکان را می‌دهد تا ارتباط برقرار کنند، اطلاعات حرفه‌ای خود را به اشتراک بگذارند و فرصت‌های شغلی را کشف کنند. این شبکه اجتماعی به کاربران امکان می‌دهد تا رزومه حرفه‌ای خود را آپدیت کنند، با همکاران، دوستان و همکاران آینده ارتباط برقرار کنند، به انجمن‌ها و گروه‌های حرفه‌ای ملحق شوند و از مقالات و مطالب مرتبط با حوزه کاری خود بهره‌مند شوند.

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

آموزش Angular: انیمیشن ها
جزییات دوره
2h 7m
47
Linkedin (لینکدین) Linkedin (لینکدین)
(آخرین آپدیت)
23,446
- از 5
ندارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Joseph Labrecque Joseph Labrecque

استاد دانشگاه، مدرس Adobe، رئیس استودیو

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

جوزف نزدیک به دو دهه تجربه در ساخت وب گویا دارد. راه حل های دسکتاپ و موبایل. او کتاب‌ها، مقالات و دوره‌های ویدئویی در زمینه فناوری‌های طراحی و توسعه، ابزارها و مفاهیم را از طریق ناشران مانند LinkedIn Learning، Peachpit Press و Adobe تالیف کرده است. او شرکت Fractured Vision Media, LLC را تأسیس کرد. یک استودیوی تولید رسانه های دیجیتال و وسیله نقلیه توزیع. جوزف استاد دانشگاه کلرادو بولدر کالج رسانه، ارتباطات و اطلاعات، و همچنین یک رهبر آموزش Adobe، Adobe Community Professional، و یکی از اعضای Adobe Partners by Design است.