فهرست مطالب مقاله آموزش قرار دادن انیمیشن بر روی دکمه در اپلیکیشن
آموزش قرار دادن انیمیشن بر روی دکمه در اپلیکیشن
یکی از قوانین طراحی متریال دیزاین در رابطه با دکمه ها گذاشتن افکت یا انیمیشن بر روی دکمه است. وقتی کاربر بر روی دکمه کلیک می‌کند نمایش افکت باعث می‌شود یک حالت تعاملی بین اپلیکیشن و کاربر برقرار شود. در واقع انیمیشن پاسخ سریعی به عملکرد کاربر است و همین موضوع موجب بهبود تجربه کاربری می‌شود.اگر کاربر بر روی دکمه کلیک کند و هیچ اتفاقی نیفتد ممکن است احساس کند شاید عمل کلیک را به درستی انجام نداده است و تجربه کاربری بدی ایجاد می‌کند.
چندین حالت انیمیشنی برای دکمه‌ها وجود دارد که شامل موارد زیر هستند. -Ripple Effect -Hover Effect -Pressed Effectدر حال حاضر انیمیشنی که بر روی دکمه‌ها استفاده می‌شود و توسط گوگل متریال دیزاین معرفی شده است Ripple Effect می‌باشد.
اگر می خواهید بدانید این افکت چطوری هست کافی است به گوگل پلی یا کافه بازار بروید و دکمه‌ای را کلیک کنید.
در این نوشته نحوه قرار دادن این افکت در اپلیکیشن با سیستم اَپ ساز را به شما اموزش می‌دهیم.
در قدم اول وارد پنل کاربری ساخت اپلیکیشن با آدرس http://make.appsaz.ir شوید.
حال وارد قسمت امکانات شوید و امکان “سورس کد” را انتخاب نمایید و نام صفحه را به خانه تغییر دهید.
در صفحه باز شده کد زیر را وارد کنید.
<!DOCTYPE html>
<html>
<head>
<style>
.button {
position: relative;
background-color: #4CAF50;
border: none;
font-size: 28px;
color: #FFFFFF;
padding: 20px;
width: 200px;
text-align: center;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
text-decoration: none;
overflow: hidden;
cursor: pointer;
}
.button:after {
content: "";
background: #90EE90;
display: block;
position: absolute;
padding-top: 300%;
padding-left: 350%;
margin-left: -20px!important;
margin-top: -120%;
opacity: 0;
transition: all 0.8s
}
.button:active:after {
padding: 0;
margin: 0;
opacity: 1;
transition: 0s
}
</style>
</head>
<body>
<h2>قرار دادن افکت بر دکمه</h2>
<button class="button">کلیک کنید.</button>
</body>
</html>
تمام شد!
متن قرمز رنگ متنی هست که بر روی دکمه قرار می‌گیرد و می توانید آن را به متن دلخواه تغییر دهید.
قسمت نارنجی رنگ عنوان صفحه هست که می‌توانید تغییرش دهید و یا کلاً پاکش کنید.روش همچنین روش دیگر این است که کد بالا را به جای امکان سورس کد در قسمت سورس امکان صفحه سفارشی قرار دهید و متن دلخواه را قبل از دکمه بنویسید.در همین رابطه توصیه می کنیم نوشته زیر را هم مطالعه کنید.
مقالات مرتبط
چرا استفاده از اپلیکیشن‌های موبایل ضروریست؟
گوشی تلفن همراه، تقریبا یک دهه است که با تغییر ماهیتی جدی و آرام پا به زندگی ما گذاشته است. به گونه‌ای پیش رفته که برای افراد تصور زندگی حتی
بهترین زبان ساخت اپلیکیشن موبایل
بسیاری از کسب‌وکار‌ها، برای بقا در فضای رقابتی جهان امروز اقدامات مختلف و بهبود دهنده‌ای را انجام می‌دهند. یکی از آن اقدامات ساخت اپلیکیشن موبایل برای تسریع و تسهیل فرآیند‌های
ایجاد تخفیف در اپلیکیشن
برای ایجاد تخفیف در اپلیکیشن کافی است پس از افزودن “تخفیف” از قسمت “افزودن صفحات” برروی آن کلیک کنید و در پنجره باز شده برروی دکمه کلیک کنید. با کلیک
الگوریتم شرطی
الگوریتم‌های شرطی یکی از پایه‌ای‌ترین مفاهیم در برنامه‌نویسی هستند که به برنامه امکان تصمیم‌گیری بر اساس شرایط مختلف را می‌دهند. در این نوع الگوریتم‌ها، برنامه ابتدا یک شرط منطقی را بررسی می‌کند و سپس با توجه به درست یا نادرست بودن آن، مسیر مناسب را اجرا می‌کند. ساختارهای شرطی معمولاً با دستورهای if، else و else if پیاده‌سازی می‌شوند و می‌توانند به‌صورت تک‌مسیره، دومسیره یا چندمسیره طراحی شوند. در این مقاله، مفهوم الگوریتم شرطی، انواع ساختارهای شرطی، نقش عملگرهای حسابی، مقایسه‌ای، منطقی و انتسابی، همچنین ترتیب اولویت عملگرها بررسی شده است. علاوه بر آن، با استفاده از مثال‌هایی به یادگیری شما کمک خواهیم کرد.
