آموزش كاربردي Crystal Report

آموزش تخصصي برنامه نويسي از مبتدي تا پيشرفته

نوشته شده در تاريخ ۲۹ تير ۱۳۸۹ توسط افشين رفوا | نظرات (0)

نحوه كاربرد Crystal Reports در برنامه هاي تحت ويندوز C#.NET

نوشته شده در تاريخ ۲۹ تير ۱۳۸۹ توسط افشين رفوا | نظرات (0)

Crystal Reporting

با استفاده از C#.NET

2003 Windows Application

مرحله 1: جهت باز كردن سند crystal report، روي پروژه راست كليك كنيد.

Add و سپس Add New item را انتخاب كنيد. پنجره جديدي مانند زير ظاهر مي شود. به گزارشتان اسم بدهيد.

مرحله 2:

بعد از كليك روي Open، پنجره ديگري خواهيد ديد كه به شما امكان مي دهد چگونگي ايجاد گزارش را با استفاده از Report Expert يا از Blank Reportيا از يك گزارش موجود انتخاب كنيد. در اينجا، من گزينه دوم يعني يك Blank Report را انتخاب مي كنم.

حالا سند Crystal Report شما باز خواهد شد. در سمت چپ، شما Field Explorer را مي بينيد كه توسط آن مي توانيد با database در ارتباط باشيد.

(اگر Field Explorer موجود نباشد، مي توانيد از Ctrl + Alt + T استفاده كنيد)

مرحله 3:

حالا براي انتخاب database، روي Database Fieldsدر Field Explorer راست كليك كنيد.

Add/Remove Database -> OLEDB(ADO) ->Make New Connection -> Microsoft OLE DB Provider for SQL Server را انتخاب كنيد. روي Next كليك كنيد و اطلاعات connectionتان را بدهيد، روي Next كليك كنيد و سپس روي Finish كليك كنيد.

حالا مي توانيد جدولها، viewهايي را كه براي Report احتياج داريد، اضافه كنيد. پنجره، شبيه اين خواهد بود.

clip_image002

مرحله 4:

حالا در Field Explorerتان مي توانيد Table/View انتخابي تان را ببينيد. Fieldهايي را كه مي خواهيد در گزارش در قسمت جزييات (Details Section) نشان دهيد، drag كنيد. صفحه زير ظاهر خواهد شد.

clip_image003

Fieldهاي Details section، اشياء Field هستند، و Fieldهاي Page Header و Report Header، اشياء متن هستند.

مرحله 5:

حالا، جهت نشان دادن اين گزارش، يك فرم برداريد و يك CrystalReportViewer به آن اضافه كنيد. (فقط CrystalReportViewer را از Tool Box روي فرم drag كنيد)

using CrystalDecisions.Shared;
using CrystalDecisions.CrystalReports.Engine;

حالا حتي اگر databaseهاي متصل به گزارش هم داشته باشيم، اما اگر database را تغيير داده باشيم، آنگاه ايجاد مجدد يك Crystal reports ممكن نخواهد بود، پس مي توانيم از TableLogOnInfo جهت متصل كردن گزارش به database استفاده كرد.

ايجاد شيء

private TableLogOnInfo LogInfo = new TableLogOnInfo();

مي توان اين تابع را به صورت زير نوشت

privatevoid SetLogonInfo()
    {
try
  {
.ConnectionInfo.ServerName=�SerVerName�;
.ConnectionInfo.UserID=�sa�;
.ConnectionInfo.Password=�ok�
.ConnectionInfo.DatabaseName=�CrystalSample�;
 }
atch(Exception ex)
{
  MessageBox.Show(ex.Message);
 }       
    }

حالا بايد شي گزارش را ايجاد كنيم. راههاي متنوعي جهت نمايش دادن گزارش وجود دارد.

يك شي از Report Document ايجاد كنيد كه بتوان در هر گزارشي كه قرار است روي آن CrystalreportViewer نشان داده شود، قابل استفاده باشد:

ReportDocumentO_Report=new ReportDocument();
rt.Load(@"E:\CrytstalSample\rptShowList.rpt");

اشياء متفاوتي براي گزارشهاي متفاوت به شرح زير ايجاد كنيد:

rptShowList O_showList =new rptShowList();
ort1.Database.Tables[0].ApplyLogOnInfo(LogInfo);

مرحله 6:

حالا مي خواهم AddressList كاربراني را كه عددشان بزرگتر از 15 است نشان دهم. بدين منظور، من DataTable را با اين ركوردها پر مي كنم و سپس آن را به گزارش الصاق (attach) مي كنم.

DataTable DT =new DataTable();
       try
           {
             string CmdStr="";
              CmdStr = �Select * fromVw_AddressList whereUser_Number>15�;
             Connection.Open();             
              SqlDataAdapterAdpt=newSqlDataAdapter(CmdStr,Connection);
             DT.Clear();
              Adpt.Fill(DT);             
           }
          catch(Exception ex)
           {
             MessageBox.Show(ex.Message);             
           }
          finally
           {
             Connection.Close();
        }

مرحله 7:

حالا DataTable پرشده بالا را به عنوان ReportsdataSource تنظيم كنيد.

O_showlist.Database.Tables[0].SetDataSource(DT);

مرحله 8:

گزارش را به عنوان crystal report viewer report sourceتنظيم كنيد تل گزارش را به viewer، bind كنيد..

CryStalReportViewer1.ReportSource = O_Report1111;
CryStalReportViewer1.Zoom(1);

همان كار را مي توان با شي متني هم كرد.

همچنين مي توان properties of Formula Field را به روشهاي ديگر هم تغيير داد.

O_showlist.DataDefinition.FormulaFields["Header"].Text = �AddressList�;

Fieldهاي :Formula

در اينجا من فقط نمونه اي از چگونگي استفاده از formula field را توضيح خواهم داد. شرح كامل formula fieldاز حوصله اين بحث خارج است.

روي Formula Field و سپس New راست كليك كنيد و آن را نامگذلري كنيد.

صفحه ويرايش Formula مانند زير ظاهر خواهد شد:

بخش سمت چپ شامل fieldهاي databaseيي مي شود كه مي توانيم روي آن fieldيي را كه مي خواهيم formula را در آن بنويسيم، انتخاب كنيم. بخش مياني تابع ها هستند. مي توانيم انواع تابع ها را به Formula اعمال كنيم. سمت راست مخصوص عمل كننده ها (operator) است، يعني جاييكه مي توانيم از عمل كننده ها در formula استفاده كنيم.

مي توان كد را به صورت زير نوشت:

if({Vw_AddressList.Gender})= 'M' then
'Male'
else
'Female'

نصب برنامه CrystalReport. Net

مرحله اول: روي Solution وسپس روي Add New Project راست كليك كنيد.

SetUp and Deployment Projects و سپس Setup Project را انتخاب كنيد. به setupتان را نامگذاري كنيد.

مرحله 2: اضافه كردن فايل Exe و فايلهاي ديگر

در File System، روي Application Folder كليك راست كنيد (معمولاً اين كار پوشه اي را در Win/Sys ايجاد مي كند) سپس Add > Project Output > و سپس Primary output و فايلهاي لازم ديگر را انتخاب كنيد.

تا اينج فرايد معمول نصب كردن بود. اگر برنامه شما Crystal Reports را هم در بر بگيرد، بايد چند كار ديگر هم بكنيد.

اضافه كردن Merge Module:

روي Setup project > Add > Merge Module > كليك راست كنيد.

ابندا Crystal_regwiz2003.msm و سپس Crystal_Managed2003.msm و Crystal_Database_Access2003_enu.msm و Crystal_Managed2003.msm را انتخاب كنيد.

روي Open كليك كنيد.

حالا چبز مهم اين است كه وقتي اين Set up را روي يك سيستم ديگر اجرا مي كنيد، با اين error مواجه مي شويد: Keycode32.Dll

دليل اين error، ندادن Registration key به فايل Merge Module است.

Crystal_regwiz2003.msm، جهت انجام اين كار روي Crystal_regwiz2003.msm كليك راست كنيد و Properties را انتخاب كنيد.

در Properties، (Merge Module Properties)را انتخاب كنيد و key را در License Key وارد كنيد.

حالا License key مي تواند Crystal Report product key باشد، يا مي توانيد آنرا از منوي Help > About Microsoft Development Environment بدست آوريد.

در آنجا رشته (string) Crystal Reports for Visual Studio .NETAAP50-GS00000-U7000RN را خواهيد ديد (ممكن است براي نسخه هاي ديگر متفاوت باشد). Key شما is'AAP50-GS00000-U7000RN' است.

حالا solution را بسازيد، و set up شما آماده است.

براي دانلود مقالات بيشتر به سايت http://www.tahlildadeh.com مراجعه نماييد.

ادامه مطلب...

صفحات اصلی و راهبردی سایت

نوشته شده در تاريخ ۲۹ تير ۱۳۸۹ توسط افشين رفوا | نظرات (0)

مقدمه

یکی از مشخصه های مشترک سایت های user-friendly این است که دارای نمای یک صفحه در کل صفحات (site-wide page layout) و scheme راهبری هستند. ASP.NET 2.0 دو ویژگی جدید معرفی می کند که پیاده سازی نمای یک صفحه در کل صفحات و scheme راهبری را بسیار ساده می کند: صفحات اصلی و راهبری سایت. صفحات اصلی به برنامه نویسان اجازه ایجاد یک template به پهنای سایت را با ناحیه های تعیین شده و قابل ویرایش می دهد. این template، را می توان صفحات ASP.NET در سایت اعمال نمود. چنین صفحات ASP.NET فقط به داشتن محتوا برای ناحیه های تعیین شده و قابل ویرایش نیاز دارند – همه markupهای دیگر در صفحات اصلی در تمامی صفحات ASP.NET که از صفحه اصلی استفاده می کنند، یکی است. این مدل به برنامه نویسان اجازه تعریف و متمرکز کردن نمای یک صفحه در کل صفحات را می دهد، و بدین ترتیب ایجاد ظاهر و احساسی یکپارچه را در تمامی صفحاتی که براحتی آپدیت می شوند، آسان می کند.

سیستم راهبری سایت (site navigation system) هم مکانیزمی برای برنامه نویسان ایجاد می کند تا نقشه سایت را تعریف کنند و هم یک API برای نقشه سایت که به طور برنامه ریزی شده ای query شود. کنترل های جدید راهبری Web– یعنی Menu، TreeView، و SiteMapPath – render کردن کل یا بخشی از نقشه سایت را در یک عنصر رایج در navigation user interface آسان می کند. ما از site navigation provider پیش فرض استفاده خواهیم کرد، بدین معنی که نقشه سایت ما در فایلی با فرمت XML تعریف می شود.

جهت نشان دادن این سه مفهوم و قابل استفاده کردن tutorialهای وبسایتمان، این مقاله را به تعریف نمای یک صفحه در کل صفحات، پیاده سازی نقشه سایت، و اضافه کردن راهبری UI اختصاص می دهیم.

شکل 1: نتیجه پایانی این مقاله

clip_image001

مرحله اول: ایجاد صفحه اصلی

قدم اول، ایجاد صفحه اصلی سایت است. در حال حاضر سایت فقط ازTyped DataSet (Northwind.xsd، در پوشه App_Code)، کلاس های BLL (ProductsBLL.cs، CategoriesBLL.cs، و غیره در پوشه App_Code )، دیتا بیس (NORTHWND.MDF، در پوشه App_Code )، فایل پیکر بندی (Web.config)، و یک فایل CSS stylesheet (Styles.css) تشکیل شده است.

شکل 2: فایل ها در پروژه ما

clip_image002

برای ایجاد یک صفحه اصلی، روی نام پروژه در Solution Explorer کلیک راست کنید و Add New Item را اضافه کنید. سپس تایپ Master Page را از لیست templateها انتخاب کنیو و نام آن را Site.master بگذارید.

شکل 3: اضافه کردن یک Master Page به وب سایت

clip_image003

site-wide page layout را در صفحه اصلی تعریف کنید. می توانید از viewی Design استفاده کنید و هر Layout یا Web کنترلی که نیاز دارید اضافه کنید، یا می توانید بطور دستی markup را در viewی Source اضافه کنید. من در صفحه اصلی، از styleهایی با تنظیمات CSS که در فایل خارجی Style.css تعریف شده، و cascading style sheetها برای موقعیت یابی (positioning) استفاده می کنم. در حالیکه نمی توان از روی markupیی که در زیر نشان داده شده نمی توان اظهارنظر کرد، قوانین CSS طوری تعریف می شوند که محتویات راهبری <div> کاملاً position می شود، طوری که در سمت چپ ظاهر می شود و دارای پهنای ثابت 200 پیکسل است.

Site.master

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="Site" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Working with Data Tutorials</title>
    <link href="Styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="wrapper">

        <form id="form1" runat="server">
        
            <div id="header">
                <span class="title">Working with Data Tutorials</span>
                <span class="breadcrumb">TODO: Breadcrumb will go here...</span>
            </div>
        
            <div id="content">
                <asp:contentplaceholder id="MainContent" runat="server">
                  <!-- Page-specific content will go here... -->
                </asp:contentplaceholder>
            </div>
            
            <div id="navigation">
                TODO: Menu will go here...
            </div>
        </form>
    </div>
</body>
</html>

یک صفحه اصلی، هم page layout استاتیک را تعریف می کند و هم ناحیه هایی را که می توان توسط صفحات ASP.NET که از صفحه اصلی استفاده می کنند، ویرایش کرد. این ناحیه ها، که محتوایشان قابل ویرایش است، توسط کنترل ContentPlaceHolder نشان داده می شوند، و می توان در محتویات <div> مشاهده کرد. صفحه اصلی ما دارای یک ContentPlaceHolder واحد است، اما ممکن است دارای ContentPlaceHolders چندگانه نیز باشد.

با markupیی که در بالا وارد شده، سوییچ کردن به viewی Design، layout صفحه اصلی را نشان می دهد. هر صفحه ASP.NET که ار این master page استفاده می کند، دارای همین layout یک شکل خواهد بود، و قابلیت مشخص کردن markup برای ناحیه MainContent خواهد داشت.

شکل 2: صفحه اصلی، هنگام مشاهده از طریق Design View

clip_image001[4]

مرحله دوم: اضافه کردن یک home page به وب سایت

حالا با صفحه اصلی ای که تعریف کرده ایم، آماده اضافه کردن صفحات ASP.NET به وب سابت هستیم. بیایید با اضافه کردن Default.aspx به home page شروع کنیم. روی نام پروژه در Solution Explorer راست کلیک کنید و Add New Item را انتخاب کنید. آپشن Web Form را از لیست template انتخاب کنید و فایل را نامگذاری کنید. چک باکس "Select master page" را نیز تیک بزنید.

شکل 5: اضافه کردن یک New Web Form، و تیک زدن چک باکس "Select master page"

بعد از OK کردن، برنامه از ما می پرسد این صفحه ASP.NET جدید باید از کدام صفحه اصلی استفاده کند. در حالیکه می توانید چندین master page در پروزه تان داشته باشید، ممکن است شما فقط یکی را انتخاب کنید.

شکل 6: انتخاب صفحه اصلی ای که این صفحه ASP.NET باید استفاده کند

clip_image003[6]

بعد از انتخاب master page، صفحه ASP.NET جدید شامل markup زیر خواهد بود:

Default.aspx

<%@ 
Page Language="C#" MasterPageFile="~/Site.master" 
AutoEventWireup="true" CodeFile="Default.aspx.cs" 
Inherits="_Default" Title="Untitled Page" %>

<asp:Content
 ID="Content1" 
ContentPlaceHolderID="MainContent" Runat="Server">

</asp:Content>

در کد راهنمایی @page، یک reference به فایل صفحه اصلی وجود دارد که مورد استفاده قرار گرفته (MasterPageFile="~/Site.master")، و markup صفحه ASP.NET، شامل یک کنترل Content برای هر یک از کنترل های ContentPlaceHolder است که در صفحه اصلی تعریف شده. کنترل Content جایی است که markupیی را که می خواهید در ContentPlaceHolder متناظر ظاهر شود، قرار می دهید. صفت Title کد راهنمایی @page را روی home تنظیم کنید و یک content خوش آمد گویی به کنترل Content اضافه کنید:

Default.aspx

<%@ 
Page Language="C#" MasterPageFile="~/Site.master"
 AutoEventWireup="true" CodeFile="Default.aspx.cs" 
Inherits="_Default" Title="Home" %>
<asp:Content
 ID="Content1"
 ContentPlaceHolderID="MainContent" Runat="Server">
   
 <h1>Welcome to the Working with Data Tutorial
 Site</h1>

    <p>
This site is being built as part of a set of tutorials that illustrate some of the new data access

and databinding features in ASP.NET 2.0 and Visual Web Developer.</p>

    <p>Over time, it will include a host of samples that demonstrate:</p>
    
    <ul>
        <li>Building a DAL (data access layer),</li>
    
    <li>Using strongly typed TableAdapters and DataTables</li>
        <li>Master-Detail reports</li>
        <li>Filtering</li>
        <li>Paging,</li>
        <li>Two-way databinding,</li>
        <li>Editing,</li>
        <li>Deleting,</li>
        <li>Inserting,</li>
        <li>Hierarchical data browsing,</li>
        <li>Hierarchical drill-down,</li>
        <li>Optimistic concurrency,</li>
        <li>And more!</li>
    </ul>
</asp:Content>

صفت Titleموجود در کد راهنمای @Page، ب ما اجازه تعیین عنوان صفحه از صفحه ASP.NET را می دهد، گرچه عنصر <title> در صفحه اصلی تعریف می شود. همچنین می توانیم با استفاده از Page.Title ، عنوان را به طور برنامه ریزی شده ای تعیین کنیم. همچنین توجه داشته باشید که referenceهای صفحه اصلی به stylesheetها (از قبیل Style.css) به طور اتوماتیک آپدیت می شوند، طوری که در صفحه ASP.NET کارایی دارند، بدون درنظر گرفتن اینکه صفحه ASP.NET در ارتباط با صفحه اصلی، در کدام دایرکتوری قراردارد.

با سوییچ کردن به viewی Design، می بینیم صفحه اصلی ما در browser چه نمایی دارد. توجه کنید که در

viewی Design برای صفحات ASP.NET ، که فقط ناحیه هایی با محتویات قابل ویرایش، را می توان ویرایش کرد، markup غیر ContentPlaceHolder که در صفحه اصلی تعریف شده، خاکستری رنگ می شود.

شکل 7: Design View برای صفحه ASP.NET، هم نواحی قابل ویرایش را نشان می ده8د هم نواحی غیر قابل ویرایش

clip_image001[6]

وقتی از صفحه Default.aspx بازدید می شود، موتور ASP.NET بطور اتوماتیک محتویات صفحه اصلی را با محتویات ASP.NET ادغام می کند، و محتویات ادغام شده به HTML، را که به browser درخواست کننده ارسال می شود، render می کند. وقتی محتویات صفحه اصلی آپدیت می شود، همه صفحات ASP.NET که از این صفحه اصلی استفاده می کند، دفعه بعد که request می شوند، محتویات شان را با محتویات جدید صفحه اصلی ادغام می کنند. بطور خلاصه، مدل صفحه اصلی به یک page layout template واحد اجازه تعریف شدن را می دهد، و تغییراتش بلافاصله در کل سایت منعکس می شود.

افزودن صفحات ASP.NET اضافی به وب سایت

بیایید نگاهی به چگونگی اضافه کردن stubهای صفحات ASP.NET به سایت بیتدازیم که نهایتا شامل demoهای مختلف گزارش گیری خواهد شد. در مجموع بیش از 35 demo وجود خواهد داشت، پس بجای ایجاد همه صفحات stub، بهتر است فقط چند صفحه ایجاد کنیم. از آنجاییکه categoryهای زیادی از demo نیز وجود خواهد داشت، به منظور مدیریت بهترdemoها، پوشه ای را برای categoryها ایجاد می کنیم. فعلاً سه پوشه زیر را ایجاد می کنیم:

BasicReporting
Filtering
CustomFormatting

نهایتاً، فایل های جدید را Solution Explorer اضافه کنید،همانطور که در شکل 8 نشان داده شده. هنگام اضافه کردن هر فایل، تیک زدن چک باکس "Select master page" را فراموش نکنید.

شکل 8: ایجاد کردن فایل های جدید

clip_image002[12]

مرحله سوم: ایجاد نقشه سایت

یکی از چالش های مدیریت یک وبسایت که از چندین صفحه تشکیل شده است، در اختیار گذاشتن روشی راحت برای کاربران جهت پیمایش (navigate) در سایت است. ابتدا باید ساختار پیمایشی ساخت را تعریف کرد. سپس باید این ساختار را به عناصر user interfaceقابل پیمایش، از قبیل منوها یا breadcrumbها تبدیل کرد. نهایتاً، کل این فرآیند باید مراقبت شوند و هنگامی که صفحات جدید به سایت اضافه می شوند وصفحات قبلی پاک می شوند، آپدیت شوند. قبل از ASP.NET، برنامه نویسان در ایجاد ساختار پیمایشی سایت، مراقبت از آن، و انتقال آن به عناصر user interface قابل پیمایش مختار بودند. اما با ASP.NET، برنامه نویسان می توانند از سیستم راهبری انعطاف پذیر درون سایت استفاده کنند.

سیستم راهبری (یا پیمایش) سایت، ابزاری را را برای تعریف نقشه سایت و سپس دسترسی به این اطلاعات از طریق یک API برنامه ریزی شده در اختیار می گذارد. ASP.NET با یک تهیه کننده نقشه سایت ship می کند که از داده های نقشه سایت انتظار دارد در یک فایل XML ذخیره شود. اما از آنجاییکه سیستم راهبری سایت بر اساس مدل provider ساخته می شود، می توان آنرا برای ساپورت روش های جایگزین serialize کردن اطلاعات نقشه سایت گسترش داد. یک روش برای ایجاد یک site map provider، تهیه نقشه سایت بر اساس ساختار سیستم فایل است.

در این مقاله از site map provider پیش فرض استفاده می کنیم که با ASP.NET 2.0 شیپ (ship) می کند. برای ایجاد نقشه سایت، کافیست روی نام پروژه در Solution Explorer کلیک راست کنید و Add New Item و سپس آپشن Site Map را انتخاب کنید. نامش را Web.sitemap بگذارید و روی دکمه Add کلیک کنید.

شکل 9: اضافه کردن نقشه سایت به پروژه تان

clip_image003[8]

فایل نقشه سایت، یک فایل XML است. توجه داشته باشید که Visual Studio، برای ساختار نقشه سایت، IntelliSense در اختیار می گذارد. فایل نقشه سایت باید دارای نُدِ <siteMap> به عنوان نُدِ (node) اصلی باشد، که باید دقیقاً حاوی یک عنصر فرزند <siteMapNode> باشد. اولین عنصر <siteMapNode> می تواند حاوی شماره ای اختیاری از عناصر فرزندی <siteMapNode> باشد.

نقشه سایت را جهت کپی برداری ساختار سیستم تعریف کنید. بدین ترتیب که، یک عنصر <siteMapNode> برای هر یک از سه پوشه، و عناصر فرزند <siteMapNode> را برای هریک از صفحات ASP.NET در آن پوشه ها اضافه کنید؛ به صورت زیر:

Web.sitemap:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >

  <siteMapNode url="~/Default.aspx" title="Home" description="Home">
      <siteMapNode title="Basic Reporting" url="~/BasicReporting/Default.aspx"

description="Basic Reporting Samples">
        <siteMapNode url="~/BasicReporting/SimpleDisplay.aspx"

title="Simple Display" description="Displays the complete contents of a database table." />
        <siteMapNode url="~/BasicReporting/DeclarativeParams.aspx"

title="Declarative Parameters"  description="Displays a subset of the

contents of a database table using parameters." />
        <siteMapNode url="~/BasicReporting/ProgrammaticParams.aspx"

 title="Setting Parameter Values" description="Shows how to set

parameter values programmatically." />
      </siteMapNode>
        
      <siteMapNode title="Filtering Reports" url="~/Filtering/Default.aspx"

description="Samples of Reports that Support Filtering">
        <siteMapNode url="~/Filtering/FilterByDropDownList.aspx"

title="Filter by Drop-Down List" description="Filter results using a drop-down list." />
        <siteMapNode url="~/Filtering/MasterDetailsDetails.aspx"

title="Master-Details-Details" description="Filter results two levels down." />
        <siteMapNode url="~/Filtering/DetailsBySelecting.aspx"

title="Details of Selected Row" description="Show detail results for a selected item in a GridView." />
      </siteMapNode>

      <siteMapNode title="Customized Formatting" url="~/CustomFormatting/Default.aspx"

description="Samples of Reports Whose Formats are Customized">
        <siteMapNode url="~/CustomFormatting/CustomColors.aspx" title="Format Colors"

description="Format the grid&apos;s colors based on the underlying data." />
        <siteMapNode url="~/CustomFormatting/GridViewTemplateField.aspx"

title="Custom Content in a GridView" description="Shows using the

TemplateField to customize the contents of a field in a GridView." />
        <siteMapNode url="~/CustomFormatting/DetailsViewTemplateField.aspx"

title="Custom Content in a DetailsView"

description="Shows using the TemplateField to customize the contents of a field in a DetailsView." />
        <siteMapNode url="~/CustomFormatting/FormView.aspx" title="Custom Content in a FormView"

description="Illustrates using a FormView for a highly customized view." />
        <siteMapNode url="~/CustomFormatting/SummaryDataInFooter.aspx" title="Summary Data in Footer"

description="Display summary data in the grid's footer." />        
      </siteMapNode>

  </siteMapNode>

</siteMap>

نقشه سایت، ساختار پیمایشی وب سایت را تعریف می کند، که یک hierarchy است که بخش های مختلف سایت را توصیف می کند. هر عنصر <siteMapNode> در Web.sitemap، نشانگر بخشی در ساختار پیمایشی سایت است.

شکل 10: نقشه سایت، یک ساختار پیمایشی Hierarchical را نشان می دهد

clip_image001[8]

ASP.NET ساختار نقشه سایت را از طریق کلاس SiteMap در .NET Framework اکسپوز (expose) می کند. این کلاس دارای خصوصیت CurrentNode است، که اطلاعات قسمتی را که کاربر در حال حاضر بازدید است بازمی گرداند؛ خصوصیت RootNode، ریشه نقشه سایت را بازمی گرداند. هم خصوصیت CurrentNode هم RootNode نمونه های SiteMapNod را که دارای خصوصیاتی نظیر ParentNode، ChildNodes، NextSibling، PreviousSibling، و غیره است که به سلسله نقشه سایت اجازه می دهد walk شوند.

مرحله چهارم: نمایش یک منو بر اساس نقشه سایت

می توان به داده ها در ASP.NET به طور برنامه ریزی شده دسترسی پیدا کرد. متلاً در ASP.NET 1.x، یا بطور تعریفی از طریق کنترل های منبع جدید داده ها. چندین کنترل درونی برای منبع داده ها از قبیل کنترل SqlDataSource برای دسترسی به داده های بانک اطلاعاتی رابطه ای، کنترل ObjectDataSource برای دسترسی به داده ها از کلاس ها، و غیره وجود دارد. حتی می توانید کنترل های منبع داده های (data source) سفارشی خودتان را نیز ایجاد کنید.

کنترل های منبع داده ها به عنوان یک پروکسی بین صفحه ASP.NET شما و داده های بنیادی عمل می کند. بمنظور نمایش داده های بازیابی شده کنترل منبع داده ها، معمولا کنترل وب دیگری به صفحه اضافه می کنیم و آن را به کنترل منبع داده ها bind می کنیم. برای bind کردن یک کنترل وب به کنترل منبع داده ها؛ کافیست property کنترل DataSourceID را روی مقدار ID property کنترل منبع داده ها تنظیم کنید.

جهت کمک به کارکردن با داده های نقشه سایت، ASP.NET، حاوی کنترل SiteMapDataSource است که به ما اجازه bind کردن کنترل وب در مقابل نقشه سایتمان را می دهد. دو کنتل وب – یعنی TreeView و Menu – معمولاً برای فراهم نمودن یک navigation user interface بکار می روند. جهت bind کردن د اده های نقشه سایت به یکی این دو کنترل، کافیست یک SiteMapDataSource به صفحه، همراه با یک کنترل TreeView یا Menu اضافه کنید، که نتیجتاخصوصیت DataSourceID شان نیز ً تنظیم می شود. مثلاً، می توان با استفاده از markup زیر یک کنترل Menu به صفحه اصلی اضافه نمود:

<div id="navigation">
    <asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1">
    </asp:Menu>
    
    <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
</div>
For a finer degree of control over the emitted HTML, we can

bind the SiteMapDataSource control to the Repeater control, like so:
<div id="navigation">
    <ul>
        <li><asp:HyperLink runat="server" ID="lnkHome"

NavigateUrl="~/Default.aspx">Home</asp:HyperLink></li>
        
        <asp:Repeater runat="server" ID="menu" DataSourceID="SiteMapDataSource1">
            <ItemTemplate>
                <li>
                    <asp:HyperLink runat="server" NavigateUrl='<%# Eval("Url") %>'><%

   1: # Eval("Title")

%></asp:HyperLink>
                </li>
            </ItemTemplate>
        </asp:Repeater>
    </ul>
    
    <asp:SiteMapDataSource ID="SiteMapDataSource1"

runat="server" ShowStartingNode="false" />
</div>

کنترل SiteMapDataSource، سلسله مراتب نقشه سایت را در یک زمان، یک level باز می گرداند، و با node اصلی نقشه سایت شروع می کند (در سایت ما Home)، و سپس level بعدی (Basic Reporting، Filtering Reports، Customized Formatting)، و الی آخر. هنگام bind کردن SiteMapDataSource به یک تکرار کننده (Repeater)، level اول بازگردانده شده را باز می گرداند و ItemTemplate برای هر نمونه از SiteMapNode در level اول را بع عنوان مثال ذکر می کند. برای دسترسی به property معینی از SiteMapNode، می توان از Eval ((propertyName) استفاده کرد که روش دست یابی ما به propertyهای SiteMapNode's Url و Title برای کنترل HyperLink است.

<li>
    <a href="/Code/BasicReporting/Default.aspx">Basic Reporting</a>
</li>

<li>
    <a href="/Code/Filtering/Default.aspx">Filtering Reports</a>
</li>

<li>
    <a href="/Code/CustomFormatting/Default.aspx">Customized Formatting</a>
</li>

nodeهای نقشه سایت (Basic Reporting، Filtering Reports، و Customized Formatting)، level دوم از نقشه سایت را که در حال render شدن است، تشکیل می دهد، نه level اول را. دلیلش این است که خصوصیت ShowStartingNode در SiteMapDataSource روی false تنظیم شده است، که باعث می شود SiteMapDataSource، ند اصلی نقشه سایت را bypass کند و در عوض با بازگرداندن level دوم در سلسله مراتب نقشه سایت شروع کند.

جهت نشان دادن زیرگزارش ها برای Basic Reporting، Filtering Reports، و Customized Formatting SiteMapNodes، می توان یک تکرا کننده ((Repeater به تکرار کننده ItemTemplate ابتدایی اضافه کرد. این تکرار کننده تانویه، به خصوصیت ChildNodes نمونه SiteMapNode، بایند (bind) می شود، مانند زیر:


<asp:Repeater runat="server" ID="menu" DataSourceID="SiteMapDataSource1">
    <ItemTemplate>
        <li>
            <asp:HyperLink runat="server" NavigateUrl='<%# Eval("Url") %>'><%

   1: # Eval("Title")

%></asp:HyperLink>

            <asp:Repeater runat="server" DataSource='<%# ((SiteMapNode)

Container.DataItem).ChildNodes %>'>
                <HeaderTemplate>
                    <ul>
                </HeaderTemplate>
                
                <ItemTemplate>
                    <li>
                        <asp:HyperLink runat="server" NavigateUrl='<%# Eval("Url") %>'><%

   1: # Eval("Title")

%
				

ادامه مطلب...

آموزش تخصصی CSS (قسمت اول)

نوشته شده در تاريخ ۲۹ تير ۱۳۸۹ توسط افشين رفوا | نظرات (0)

در این سلسله از مقالات، چگونگی استفاده از CSS جهت کنترل style و layout چندین صفحه وب بطور همزمان را یاد خواهید گرفت.

برای یادگیری CSS، شما باید درکی پایه ای از مفاهیم HTML و XHTML داشته باشید.

نمونه از CSS

body
{
background-color:#d0e4fe;
}
h1
{
color:orange;
text-align:center;
}
p
{
font-family:"Times New Roman";
font-size:20px;
}

CSS چیست؟

CSS مخفف Cascading Style Sheets است
styleها چگونگی نمایش عناصر HTML را تعریف می کنند
styleها برای حل یک مشکل به HTML 4.0 اضافه شدند
External Style Sheets می تواند در در انجام کار صرفه جویی کند
External Style Sheets در فایل های CSS ذخیره می شوند

نمایش CSS

سند HTML را می توان با styleهای مختلف نمایش داد.

Styleها مشکل بزرگی را حل کردند

HTML هرگز به قصد در برگرفتن tag برای فرمت کردن یک سند ایجاد نشد.

HTML هرگز به قصد تعریف محتوای یک سند ایجاد نشد.

وقتی tagهایی مانند <font> و attributeهای رنگ به HTML 3.2 اضافه شد، کابوسی برای برنامه نویسان بود. develop کردن وبسایت های بزرگ، که فونت ها و اطلاعات رنگ به هر صفحه مجزا اضافه شدند، فرآیندی طولانی و پرهزینه شد.

برای حل این مشکل، کنسرسیوم World Wide Web، تصمیم گرفت CSS را ایجاد کند.

در HTML 4.0، می توان کل فرمتینگ را از سند HTML حذف کرد، و در فایل CSS جداگانه ای ذخیره کرد.

امروزه، همه مرورگرها CSS را ساپورت می کنند.

CSS، در انجام مقدار زیادی کار صرفه جویی می کند

CSS، تعریف می کند عناصر HTML چگونه نمایش داده می شوند.

معمولاً Styleها در فایلهای .css ذخیره می شوند. style sheetهای خارجی شما راتنها با ویرایش یک فایل قادر به تغییر ظاهر و layout همه صفحات موجود در یک وبسایت می کند.

مثال

فایل HTML زیر، لینکی به یک style sheet خارجی با تگ <link> است:

<html>
<head>
<link rel="stylesheet" 
type="text/css" href="ex1.css" />
</head>

<body>

<h1>This header is 36 pt</h1>
<h2>This header is blue</h2>

<p>This paragraph has a left margin of 50 pixels</p> 

</body>
</html>

این، فایل style sheet است:

body
{
background-color:yellow;
}
h1
{
font-size:36pt;
}
h2
{
color:blue;
}
p
{
margin-left:50px;
}

سینتکس CSS

قاعده CSS، دارای دو بخش اصلی است: یک selector، و یک یا چندین تعریف (declaration):

clip_image001

selector، معمولاً عنصر HTML است که می خواهید style کنید.

هر declaration، از یک property و یک value تشکیل شده است.

property، استایل اتریبیوتی (style attribute) است که می خواهید تغییر دهید. هر property دارای یک value است.

نمونه از CSS

declarationهای CSS، همیشه با یک نقطه ویرگول (;) تمام می شوند، و گروههای declaration در کمانک {} قرار می گیرند:

p {color:red;text-align:center;}

برای اینکه CSS را بیشتر قابل خواندن کنید، می توانید هر declaration را در یک خط قرار دهید، مانند مثال زیر:

p
{
color:red;
text-align:center;
}

Commentهای CSS

می توانید ازcommentها برای توضیح کدتان استفاده کنید، و ممکن است هنگامی که source code را ویرایش می کنید، به شما کمک کنند. مرورگرها، کامنت ها را نادیده می گیرند.

/*This is a comment*/
p
{
text-align:center;
/*This is another comment*/
color:black;
font-family:arial;
}

Selectorهای id و class

CSS علاوه بر تنظیم یک style برای عنصر HTML، به شما اجازه تعیین selectorهای خودتان به نام های "id" و "class" را هم می دهد.

سلکتور id

از سلکتور id برای تعیین style برای عنصر واحد و چندگانه استفاده می شود.

سلکتور id از اتریبیوت عنصر HTML استفاده می کند، و با یک "#" تعریف می شود.

قانون style زیر به عنصری با آی دی ="para1" اعمال می شود:

#para1
{
text-align:center;
color:red;
}

نام id را با عدد شروع نکنید! زیرا در Mozilla/Firefox کار نمی کند.

سلکتور class

از سلکتور class برای تعیین یک style برای گروهی از عناصر استفاده می شود. برخلاف سلکتور id، سلکتور class اغلب روی چندین عنصر بکار می رود.

این کار به شما اجازه تعیین یک style معین برای هر عنصر HTML با همان کلاس را می دهد.

سلکتور کلاس از اتریبیوت کلاس HTML استفاده می کند، و با یک "." تعریف می شود.

در مثال زیر، همه عناصر HTML با کلاس ""center، وسط چین خواهند شد:

.center {text-align:center;}

هرگز نام یک کلاس را با عدد شروع نکنید! زیرا فقط در Internet Explorer ساپورت می شود.

سه راه برای insert کردن CSS

External style sheet
Internal style sheet
Inline style

Style Sheet خارجی (external)

Style Sheet خارجی، هنگامی که style به صفحات زیادی اعمال می شود، مناسب است. با یک Style Sheet خارجی، می توانید ظاهر کل یک سایت ر با تغییر دادن یک فایل عوض کنید. هر صفحه باید با استفاده از تگ <link> به style sheet لینک شود. تگ <link>، درون بخش head قرارمی گیرد:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>

Style Sheet خارجی، را می توان در یک text editor نوشت. این فایل نباید حاوی هیچ تگ html باشد. style sheet شما باید با پسوند .css ذخیره شود. نمونه ای از یک style sheet در زیر نشان داده شده است:

hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}

فضاهای بین مقدار property و واحدها را خالی نگذارید!

Style Sheet داخلی (internal)

Style Sheet داخلی باید هنگامی مورد استفاده قرار گیرد که یک سند واحد، style منحصر به فردی دارد. styleهای داخلی با استفاده از تگ <style> در بخش head صفحه HTML تعریف می شود، مانند مثال زیر:

<head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>

Styleهای Inline

استایل inline، با ترکیب کردن contentبا presentation، بسیاری از مزایای style sheetها را از دست می دهد. از این متد باید به ندرت استفاده کرد.

برای استفاده از استایل های inline، باید از اتریبیوت استایل در تگ مربوط استفاده کرد. اتریبیوت استایل ممکن است هر نوع خصوصیت CSS را در بر گیرد. این مثال چگونگی تغییر دادن رنگ و حاشیه چپ یک پاراگراف را نشان می دهد:

<p style="color:sienna;margin-left:20px">This is a paragraph.</p>

Style Sheetهای چندگانه

اگر بعضی از propertyها برای یک selector در style sheetهای مختلف تعیین شده باشد، valueها از style sheet معینی ارث برده خواهند شد.

مثلاً، یک style sheet خارجی دارای propertyهای زیر برای سلکتور h3 است:

h3
{
color:red;
text-align:left;
font-size:8pt;
}

و یک style sheet داخلی دارای propertyهای زیر برای سلکتور h3 است:

h3
{
text-align:right;
font-size:20pt;
}

اگر صفحه ای با style sheet داخلی به یک style sheet خارجی لینک شود، propertyهای h3 اینگونه خواهد بود:

color:red;
text-align:right;
font-size:20pt;

رنگ، از style sheet خارجی ارث می برد و text-alignment و اندازه فونت با style sheet داخلی جایگزین می شود.

Styleهای چندگانه به یک استایل cascade می شوند

Styleها را می توان به طرق زیر معین کرد:

درون یک عنصر HTML
درون بخش head صفحه HTML
در یک فایل CSS خارجی

نکته: حتی style sheetهای خارجی چندگانه را نیز می توان درون یک سند HTML واحد reference کرد.

ترتیب cascade کردن

هنگامی که بیش از یک style که برای عنصر HTML تعیین شده، وجود داشته باشد، از کدام style استفاده می شود؟

معمولاً می توان گفت که همه styleها، با قوانین زیر به یک style sheet مجازی cascade می شود، و قانون چهارم بالاترین اولویت را دارد:

پبش فرض مرورگر
style sheet خارجی
style sheet داخلی (در بخش head)
استایل inline (درون عنصر HTML)

بنابراین، یک استایل inline، بالاترین اولوین را دارد، که بدین معناست که استایلی را که درون تگ <head> تعریف شده، یا در یک style sheet خارجی، یا در مرورگر را override می کند.

نکته: اگر لینک به style sheet خارجی بعد از style sheet داخلی در HTML <head> داخلی قرار داده شود، style sheet خارجی، style sheet داخلی را override می کند.

ادامه مطلب...

[ ۱ ]

درباره وبلاگ

tahllildadehins@gmail.com
کل مطالب
آرشیو مطالب
RSS

موضوعات

موضوعي ثبت نشده است

آخرین مطالب

دانلود رايگان كتابهاي الكترونيكي

نحوه كاربرد Crystal Reports در برنامه هاي تحت ويندوز C#.NET

صفحات اصلی و راهبردی سایت

آموزش تخصصی CSS (قسمت اول)

آرشيو

تير ۱۳۸۹

پيوند ها

لينكي ثبت نشده است

ساخت وبلاگ
قالب وبلاگ