آموزش قرار دادن انیمیشن بر روی دکمه در اپلیکیشن
فهرست مطالب مقاله آموزش قرار دادن انیمیشن بر روی دکمه در اپلیکیشن
آموزش قرار دادن انیمیشن بر روی دکمه در اپلیکیشن
یکی از قوانین طراحی متریال دیزاین در رابطه با دکمه ها گذاشتن افکت یا انیمیشن بر روی دکمه است. وقتی کاربر بر روی دکمه کلیک میکند نمایش افکت باعث میشود یک حالت تعاملی بین اپلیکیشن و کاربر برقرار شود. در واقع انیمیشن پاسخ سریعی به عملکرد کاربر است و همین موضوع موجب بهبود تجربه کاربری میشود.اگر کاربر بر روی دکمه کلیک کند و هیچ اتفاقی نیفتد ممکن است احساس کند شاید عمل کلیک را به درستی انجام نداده است و تجربه کاربری بدی ایجاد میکند.
چندین حالت انیمیشنی برای دکمهها وجود دارد که شامل موارد زیر هستند. -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 پیادهسازی میشوند و میتوانند بهصورت تکمسیره، دومسیره یا چندمسیره طراحی شوند. در این مقاله، مفهوم الگوریتم شرطی، انواع ساختارهای شرطی، نقش عملگرهای حسابی، مقایسهای، منطقی و انتسابی، همچنین ترتیب اولویت عملگرها بررسی شده است. علاوه بر آن، با استفاده از مثالهایی به یادگیری شما کمک خواهیم کرد.
ساختمان داده
ساختمان داده (Data Structure) یکی از مهمترین مفاهیم علوم کامپیوتر و برنامهنویسی است که نحوه سازماندهی، ذخیرهسازی و مدیریت دادهها را برای افزایش سرعت و کارایی الگوریتمها مشخص میکند. در این مقاله با تعریف ساختمان داده، انواع ساختمان دادههای خطی و غیرخطی، آرایه (Array)، لیست پیوندی (Linked List)، پشته (Stack)، صف (Queue)، درخت (Tree)، گراف (Graph)، مجموعه (Set) و نگاشت (Map) آشنا میشوید. همچنین کاربرد، مزایا، معایب و تفاوت هر ساختار داده را همراه با مثالهای ساده و قابل فهم بررسی میکنیم تا بتوانید بهترین ساختمان داده را برای حل مسائل برنامهنویسی و توسعه نرمافزار انتخاب کنید.
الگوریتم ترتیبی
الگوریتم ترتیبی یکی از سادهترین و پایهایترین انواع الگوریتم در برنامهنویسی است که در آن دستورها بهصورت مرحلهبهمرحله و دقیقاً به همان ترتیبی که نوشته شدهاند اجرا میشوند. در این نوع الگوریتم، خبری از شرط، تکرار یا انشعاب پیچیده نیست و همین موضوع باعث میشود برای آموزش مفاهیم اولیه برنامهنویسی، حل مسائل ساده و نمایش جریان منطقی برنامه بسیار کاربردی باشد. در این مقاله مفهوم الگوریتم ترتیبی، ساختار کلی آن، مثالهایی مانند جمع دو عدد و محاسبه محیط مستطیل، مزایا، محدودیتها و جایگاه آن در فلوچارتها بررسی میشود.
منطق کامپیوتر
فهرست مطالب این مقاله منطق کامپیوتر چیست ؟ در کامپیوتر همه چیز به صورت صفر و یک کار میکند، یعنی همه چیز یا صفر است یا یک، یا روشن است
جاوا چیست؟
جاوا چیست؟ یک زبان برنامه نویسی شیء گرا یا Object Oriented قدرتمند و چند سکویی Cross platform است که اولین بار توسط شرکت Sun Microsystems در سال 1995 معرفی شد
