فهرست مطالب مقاله قرار دادن تب در اپلیکیشن
یکی از امکانات جالبی که می توانید با استفاده از سیستم اَپ ساز در اپلیکیشن ایجاد کنید. قرار دادن تب است. در این مقاله آموزش قرار دادن تب در اپلیکیشن را به شما آموزش می دهیم.
ابتدا وارد پنل کاربری ساخت اپلیکیشن شوید و در بخش امکانات، امکان “سورس کد” را انتخاب کنید.
برای استفاده از این امکان هم نیازی به دانش برنامه نویسی نیست، فقط کافیست کد زیر را کپی و در قسمت سورس کد وارد نمایید. استفاده از این امکان برنامه شما را در بین سایر ا ها;متمایز خواهد کرد.
در صفحه وارد شده کد زیر را قرار دهید.
<!DOCTYPE html>
<html>
<head>
<style>
body {font-family: "Tahoma", sans-serif;
direction:rtl;
}
/* Style the tab */
div.tab {
overflow: hidden;
border: 1px solid #ccc;
background-color: #f16621;
}
/* Style the buttons inside the tab */
div.tab button {
background-color: inherit;
float: right;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
font-size: 17px;
}
/* Change background color of buttons on hover */
div.tab button:hover {
background-color: #eee;
}
/* Create an active/current tablink class */
div.tab button.active {
background-color: #fff;
}
/* Style the tab content */
.tabcontent {
display: none;
padding: 6px 12px;
-webkit-animation: fadeEffect 1s;
direction:rtl;
animation: fadeEffect 1s;
background-color:#e8bdc7;
}
/* Fade in tabs */
@-webkit-keyframes fadeEffect {
from {opacity: 0;}
to {opacity: 1;}
}
@keyframes fadeEffect {
from {opacity: 0;}
to {opacity: 1;}
}
</style>
</head>
<body>
<h3>آموزش ساخت تب در اپلیکیشن</h3>
<div class="tab">
<button class="tablinks" onclick="openTabs(event, 'tab1')">تب ۱</button>
<button class="tablinks" onclick="openTabs(event, 'tab2')">تب ۲</button>
<button class="tablinks" onclick="openTabs(event, 'tab3')">تب ۳</button>
</div>
<div id="tab1" class="tabcontent">
<h3>اپ ساز</h3>
<p>مرکز ساخت اپلیکیشن های موبایل</p>
</div>
<div id="tab2" class="tabcontent">
<h3>ساخت اپ فروشگاهی</h3>
<p>با استفاده از سیستم اپ ساز اپ فروشگاهی خودت را بساز!</p>
</div>
<div id="tab3" class="tabcontent">
<h3>اپ ساز هیبرید</h3>
<p>ساخت اپلیکیشن با امکانات سفارشی.</p>
</div>
<script>
function openTabs(evt, cityName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(cityName).style.display = "block";
evt.currentTarget.className += " active";
}
</script>
</body>
</html>
در کد بالا سه تا تب با عناوین تب۱، تب۲ و تب ۳ ساختیم و درون هر تب نیز عنوان و متنی قرار داده ایم. شما با تغییر دادن متن های فارسی و جایگزین کردنش با متن دلخواه می توانید تب سفارشی مخصوص به خود را بسازید. خروجی مشابه تصویر زیر می باشد.

همچنین می توانید به تعداد دلخواه تب بسازید و رنگ بندی را نیز به دلخواه خود تغییر دهید. برای تغییر رنگ کافیست کد رنگ ها را در کد تغییر دهید.(مثلا background-color:#ffff)
برای افزودن تب نیز باید همانند کدهای سه تب دیگر عمل کنید.
مقالات مرتبط
چرا استفاده از اپلیکیشنهای موبایل ضروریست؟
گوشی تلفن همراه، تقریبا یک دهه است که با تغییر ماهیتی جدی و آرام پا به زندگی ما گذاشته است. به گونهای پیش رفته که برای افراد تصور زندگی حتی
بهترین زبان ساخت اپلیکیشن موبایل
بسیاری از کسبوکارها، برای بقا در فضای رقابتی جهان امروز اقدامات مختلف و بهبود دهندهای را انجام میدهند. یکی از آن اقدامات ساخت اپلیکیشن موبایل برای تسریع و تسهیل فرآیندهای
ایجاد تخفیف در اپلیکیشن
برای ایجاد تخفیف در اپلیکیشن کافی است پس از افزودن “تخفیف” از قسمت “افزودن صفحات” برروی آن کلیک کنید و در پنجره باز شده برروی دکمه کلیک کنید. با کلیک
الگوریتم شرطی
الگوریتمهای شرطی یکی از پایهایترین مفاهیم در برنامهنویسی هستند که به برنامه امکان تصمیمگیری بر اساس شرایط مختلف را میدهند. در این نوع الگوریتمها، برنامه ابتدا یک شرط منطقی را بررسی میکند و سپس با توجه به درست یا نادرست بودن آن، مسیر مناسب را اجرا میکند. ساختارهای شرطی معمولاً با دستورهای if، else و else if پیادهسازی میشوند و میتوانند بهصورت تکمسیره، دومسیره یا چندمسیره طراحی شوند. در این مقاله، مفهوم الگوریتم شرطی، انواع ساختارهای شرطی، نقش عملگرهای حسابی، مقایسهای، منطقی و انتسابی، همچنین ترتیب اولویت عملگرها بررسی شده است. علاوه بر آن، با استفاده از مثالهایی به یادگیری شما کمک خواهیم کرد.