طراحی سایت با Asp.Net

همانطور که اشاره شد Asp.net زبانی است که برای نوشتن آن باید از نرم افزاری به نام Visual Studio  استفاده کرد.

پس بدین منظور در اولین قدم  Visual Studio را تهیه و نصب کنید.(هیچ فرقی نمی کند که 2008 ، 2010 و یا نگارش دیگر آن باشد)

پس با این فرض ادامه می دهیم که شما Visual Studio یا همان VB را نصب و راه اندازی کرده باشید.

به نظرم مفید ترین روشی که میتونم بهتون بگم اینه که در اول با سایت www.obout.com آشناتون کنم، در این سایت هر چیزی که نیاز دارید از ایجاد یه دکمه گرفته و ساخت اسلاید گرفته تا راه اندازی سیستم های آپلود و... همگی به صورت پروژه آمده است.

من در اینجا به شما ساخت اسلایدشو را شما آموزش می دهم.

معرفی Show

لطفا به سایت مذکور برید، اونجا می تونید گزینه Showرو ببینید.

Show  از مجموعه obout، کنترلی است که امکان ایجاد افکت های حرکتی زیبا و حرفه ای را بر روی کنترل های صفحات وب ایجاد می کند. افکت هایی همچون Fading , Scrolling left , Scrolling right و ... .

همچنین این کنترل قابلیت تنظیمات سفارشی در سمت Clint  توسط کاربر را نیز دارد. در این آموزش با ایجاد چند پروژه استفاده از قابلیت های کلیدی این کنترل را به شکل کاربردی بیان خواهیم نمود.

خاصیت های کاربردی و ویژگی های Show

Scroll Direction: این خاصیت تنظیم کننده جهت حرکت کنترل Show می باشد و چهار جهت جغرافیا مقادیرش می باشد.

Show/Type: نوع نمایش را کنترل می کند.

Transition Type: بیان گر نوع حرکت کنترل است و دارای مقادیر Quick Scroll ، Scrolling و Fading (جلوه محو) می باشد.

Start Time Delay: این خاصیت بیان گر زمان تاخیر شروع حرکت در زمان Load کنترل است.

StyleFolder: این خاصیت مسیر پوشه حاوی فایل Css و تصاویر برای تنظیمات قالب ظاهری می باشد.

Time Between Panels: این خاصیت مدت زمان تاخیر در نمایش بین پنل ها را تنظیم می کند.

Scrolling Speed: تنظیم کننده سرعت تعویض تصاویر در افکت Scroll  است.

Scrolling Step: تنظیم کننده تعداد فریم های افکت fade است.

Fading Speed: تنظیم کننده سرعت تعویض تصاویر در افکت Fade  می باشد.

Fading Step: این خاصیت تنظیم کننده تعداد فریم های افکت Fade می باشد.

Manual Changer: با تنظیم این خاصیت با مقدار True، می توان دکمه هایی برای انتخاب تصاویر به شکل سفارشی، برای این کنترل تنظیم نمود.

Start Time Delay: این خاصیت بیان گر زمان تاخیر شروع حرکت در زمان بارگذاری کنترل می باشد.

حالا که با خاصیت های مختلف آشنا شدیم شروع می کنیم به یک کار عملی و حقیقی.

پروژه ساخت اسلاید با خاصیت Fading:

در این پروژه قصد داریم تا 3 تصویر را با کمک کنترل Show به شکل جلوه Fade نمایش دهیم.

ویژوال استدیو 2008 را باز کرده و طبق مراحل زیر یک پروژه وب سایت ایجاد نمایید.

در پنجره باز شده گزینه Asp.net Web site  را انتخاب کرده و از بخش Language گزینه Visual C# را انتخاب کنید و پس از تعیین مسیر پروژه در سیستم خود از بخش Location دکمه Ok را انتخاب نمایید.

حال باید کامپوننت about_show را به پروژه معرفی و اضافه نماییم. برای این کار بر روی Soloution کلیک راست کرده و پوشه جدیدی با نام bin بسازید.

سپس به مسیر زیر رفته:

Obout_show\bin

و فایل obout_Show_Net.dll را از پوشه bin  کپی کرده و در پروژه خود Paste کنید.

روش راحت تر: در حالی که پروژه باز است از پوشه مسیر فایل را با ماوس انتخاب کرده و به درون پوشه bin  پروژه Drag و Drop کنید.

سپس برای معرفی کامپوننت در پروژه روی عنوان پروژه در پنجره Soloution کلیک راست کرده و گزینه Add Reference را انتخاب نمایید. سپس در پنجره ظاهر شده از تب Browse  فایل obout_Show_Net.dll را انتخاب کرده و دکمه ok را انتخاب کنید.

حال کنترل show آماده استفاده در پروژه می باشد. برای افزودن این کنترل به صفحه Source  مُد پروژه را باز کرده و کد زیر را در بالای صفحه تایپ نمایید.

<%@ Register assembly="obout_Show_Net" namespace="OboutInc.Show" tagprefix="obshow"%>

این تگ امکان استفاده از کنترل Show در صفحه fading.aspx را فراهم می کند.

روش دیگری که برای این کار می توان بکار برد، این است که برای اضافه کردن این کنترل و درج خودکار این کدها در صفحه وجود دارد.

به این صورت که ابتدا کنترل obout-show را به پنجره Toolbox پروژه اضافه کرده و سپس این کنترل را به داخل صفحه Drag و Drop نماییم.

برای انجام این کار روی تب General در Toolbox کلیلک راست کرده و گزینه Add Tab را برای ایجاد تب جدید انتخاب کنید.

سپس نام oboutControls را برای آن تایپ نمایید.

سپس بر روی تب جدید ایجاد شده( oboutControls) کلیک راست کرده و Choose Items را برای اضافه کردن کنترل انتخاب کنید.

حال در پنجره ظاهر شده، در تب .Net Framework Component دکمه Browse را انتخاب کرده و از مسیر پوشه bin پروژه خود، فایل obout_Show_Net.dll  را مطابق شکل زیر انتخاب نمایید.

  1. حال به برگه Source پروژه رفته و کد های زیر را در محلی درون تگ Head صفحه تایپ کنید.
 
<head runat="server">
<title>obout ASP.NET Show examples</title>
<style type="text/CSS">
.panelTable
{
border-collapse: separate;
border-spacing: expression(cellSpacing=0);
border-spacing: 0px;
border-padding: expression(cellPadding=0);
border-padding: 0px;
}
.title
{
Color:crimson;
Font-size:14px;
Font-weight:bold;
}
Body
{
Font-family:Tahoma;
}
.examples
{
Font-size:12px
}
.tdText
{
Font-size:12px;
}
</style>
</head>
 

در داخل تگ style، کلاسی با قالب Css به منظور تنظیم ظاهر نمایشی کنترل show  ایجادنمودیم. به طور مثال "font-family:Tahoma;" در Body نشان دهنده این است که فونت تمامی متون داخل این کنترل از نوع "Tahoma" می باشد.

امیدوارم مفید بوده باشه

نمونه ای از آخرین کارهای ما

کافه زولا

کافه زولا

  • زمان انجام سال 91
گروه طراحی خلاق

گروه طراحی خلاق

  • زمان انجام سال 92
سنگ محلات

سنگ محلات

  • زمان انجام سال 91
آسان حفاظت

آسان حفاظت

  • زمان انجام سال 93
طراحی سایت با Asp.NetReviewed by Goolexacom on Oct 23Rating: 4.0آموزش asp.netآموزش asp.net

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

اگر ربات نیستی جواب بده *

پشتیبانی سایت سئو سایت

خدمات سایت

سئو

خدمات سایت

پشتیبانی سایت سئو سایت خدمات سایت