دريافت قالب هاي زيبا براي GridView

[merlin_vista]

دوستان در اين تاپيك فقط تم و Skin براي گريدويو (GridView ) قرا ميگيرد .
چند نكته براي گزاشتن تم شما در اينجا :
1 - حتماً يك تصوير از تم خود بگزاريد /
2 - در حد امكان چند خط توضيح انگليسي يا فارسي براي آن بنويسيد .

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


Glassy Black GridView Theme
http://www.cyberslingers.com/Sandbox/Images/GlassyBlackGridViewScreen.jpg


ديدن نمونه (http://cyberslingers.com/Sandbox/GridView.aspx)

ديافت تم (http://cyberslingers.com/Sandbox/GridViewCSSThemes/GridViewCSSThemes.zip)

نمايش تم (http://cyberslingers.com/Sandbox/GridViewCSSThemes/ChromeBlackGridView.css)

اين نمونه از تم شمال رنگ بندي هاي گوناگون هست و براي دريافت ميتوانيد به اينجا مراجعه كنيد (http://cyberslingers.com/Sandbox/GridView.aspx) و از ليست انتخاب كنيد
http://www.cyberslingers.com/Sandbox/Images/GridViewPreviewScreen.jpg

[merlin_vista]

5 GridView Themes Based on Google's Personalized Homepage (igoogle)


http://mattberseth.com/WindowsLiveWriter/FiveGridViewThemesbasedon_11611/image%7B0%7D%5B5%5D.png

نمونه تم (http://mattberseth2.com/igoogle_themes/)

دانلود تم (http://mattberseth2.com/downloads/igoogle_themes.zip)

منبع (http://mattberseth.com)

[merlin_vista]

Gamer GridView Theme
http://www.cyberslingers.com/Sandbox/Images/GamerGridViewScreen.jpg

نمونه تم (http://www.cyberslingers.com/Sandbox/GamerGridView.aspx)


CSS links in Head tag:

<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<link href="GamerGridView.css" rel="stylesheet" type="text/css" />

Standard GridView declaration:

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True"
AutoGenerateColumns="False" CssClass="GridViewStyle" DataKeyNames="CustomerID" DataSourceID="ObjectDataSource1"
GridLines="None">
<Columns>
<!-- Your columns here -->

</Columns>
<FooterStyle CssClass="FooterStyle" />
<RowStyle CssClass="RowStyle" />
<EmptyDataRowStyle CssClass="EmptyRowStyle" />
<PagerStyle CssClass="PagerStyle" />
<SelectedRowStyle CssClass="SelectedRowStyle" />
<HeaderStyle CssClass="HeaderStyle" />
<EditRowStyle CssClass="EditRowStyle" />
<AlternatingRowStyle CssClass="AltRowStyle" />
</asp:GridView>

Css تم :

/*GridViewCSS Glass Black Style*/

.GridViewStyle

{

font-family: Arial, Sans-Serif;

font-size:small;

table-layout: auto;

border-collapse: collapse;

border: #1d1d1d 1px solid;

}

/*Header and Pager styles*/

.HeaderStyle

{

background-image: url(Images/HeaderGamer_left.jpg);

background-position:left;

background-repeat:repeat-x;

height:30px;

}

.PagerStyle

{

background-image: url(Images/PagerGamer.jpg);

background-position:top;

background-repeat:repeat-x;

}

.HeaderStyle th

{

padding: 0px;

color: #ffffff;

}

.HeaderStyle a:link, a:visited

{

text-decoration:none;

color:#ffffff;

display:block;

text-align:left;

font-weight:normal;

border-left:solid 1px #666666;

border-right:solid 1px #1d1d1d;

padding-top:25px;

padding-bottom:9px;

padding-right:5px;

padding-left:5px;

background-image: url(Images/HeaderGamer.jpg);

background-position:top;

background-repeat:repeat-x;

}

.HeaderStyle a:hover

{

background-image: url(Images/HeaderGamer_Hover.jpg);

background-position:top;

background-repeat:repeat-x;

}

.PagerStyle table

{

text-align:center;

margin:auto;

}

.PagerStyle table td

{

border:0px;

padding:5px;/*padding around pager numbers */

}

.PagerStyle td

{

border-top: #1d1d1d 1px solid;/*top border of pager*/

height:40px;

}

.PagerStyle a

{

color:#ffffff;

text-decoration:none;

padding:2px 10px 2px 10px;

/*border around pager numbers*/

border-top:solid 1px #777777;

border-right:solid 1px #333333;

border-bottom:solid 1px #333333;

border-left:solid 1px #777777;

}

.PagerStyle span

{

font-weight:bold;

color:#FFFFFF;

text-decoration:none;

padding:2px 10px 2px 10px;

}

/*RowStyles*/

.RowStyle td, .AltRowStyle td, .SelectedRowStyle td, .EditRowStyle td /*Common Styles*/

{

padding: 5px;

border-right: solid 1px #1d1d1d;

}

.RowStyle td

{

background-color: #333333;

color: #ffffff;

}

.AltRowStyle td

{

background-color: #1d1d1d;

color:#ffffff;

}

.SelectedRowStyle td

{

background-color: #ffff66;

}




تصاوير تم :

http://www.cyberslingers.com/Sandbox/Images/PagerGamer.jpg

http://www.cyberslingers.com/Sandbox/Images/PagerGamer.png

http://www.cyberslingers.com/Sandbox/Images/HeaderGamer.jpg

http://www.cyberslingers.com/Sandbox/Images/HeaderGamer.png


http://www.cyberslingers.com/Sandbox/Images/HeaderGamer_left.jpg


http://www.cyberslingers.com/Sandbox/Images/HeaderGamer_Hover.jpg

[Amir Taghavi]

چند روز پیش یه سورس گذاشتم در موزد GV، توش یه css هست واسه Gv. کم بد نیست:

http://barnamenevis.org/forum/showthread.php?t=115672

[DotNet_King]

ولی دوستان اینها یه مشکل دارند! اونهم اون نمونه ای که خودشون گذاشتند خیلی دیر لود میشه!
به نظر شما می ارزه استفاده از این مدل تم به استفاده نکردن ازشون؟

[merlin_vista]

ولی دوستان اینها یه مشکل دارند! اونهم اون نمونه ای که خودشون گذاشتند خیلی دیر لود میشه!

دوست عزيز شما اگه ميخواهي كه وب سايت زيبا و گرافيكي داشته باشي خوب طبيعي هست كه نسبت به يه وب سايت بدون گرافيك ديرتر لود بشه .

[merlin_vista]

Google Analytics Style GridView
اين هم براي آن دسته از دوستاني كه ميگن تم هاي گرافيكي دير لود ميشه
تم گريدويو گوگل آناليزم
http://i37.tinypic.com/168y0kw.jpg


نمونه تم (http://mattberseth2.com/google_analytics_gridview/default.aspx)

دانلود تم (http://mattberseth2.com/downloads/google_analyitics_gridview_part_1.zip)

منبع (http://mattberseth2.com)

[merlin_vista]

4 New Grouping Grid Skins: Vista, Bold, Win2k3 and Soft
چهار عدد تم زيبا براي گريد ويو و سرعت لود خوب
http://i33.tinypic.com/v7xq38.jpg

http://i35.tinypic.com/rvgjgl.jpg


http://i34.tinypic.com/241ku3t.jpg

http://i38.tinypic.com/2ey87ew.jpg


نمونه تم ها (http://mattberseth2.com/grouping_grid_skins/default.aspx)

دانلود تم ها (http://mattberseth2.com/downloads/grouping_grid_skins%20%282%29.zip)

منبع (http://mattberseth2.com)

[merlin_vista]

Improving the Presentation of an Extra-Wide GridView


http://mattberseth.com/WindowsLiveWriter/TableclothStyleGridViewWithColumnandRowM_89D9/image%7B0%7D.png


نمونه تم (http://mattberseth2.com/table_cloth_gridview/default.aspx)

دانلود تم (http://mattberseth2.com/downloads/gridview_row_column_hover_effects.zip)

منبع (http://mattberseth2.com)

[merlin_vista]

A YUI DataTable Styled GridView


http://mattberseth.com/WindowsLiveWriter/AYUIDataTableStyledGridView_E126/image%7B0%7D%5B2%5D.png


نمونه تم (http://mattberseth2.com/yui_style_gridview/default.aspx)

دانلود تم (http://mattberseth2.com/downloads/yui_style_gridview.zip)

منبع (http://mattberseth2.com)

[amirfallah3301]

A YUI DataTable Styled GridView


http://mattberseth.com/WindowsLiveWriter/AYUIDataTableStyledGridView_E126/image%7B0%7D%5B2%5D.png


نمونه تم (http://mattberseth2.com/yui_style_gridview/default.aspx)

دانلود تم (http://mattberseth2.com/downloads/yui_style_gridview.zip)

منبع (http://mattberseth2.com)



سلام من توی asp مبتدی هستم، می خواستم بدونم چطور می شه از این تم ها استفاده کرد، می شه زحمت یه آموزش کوچکش رو بکشید؟!:چشمک:

[Mohandes2009]

ممنون دوست عزیز برای استفاده باید CSS را به گرید خود vs اضافه کنیم یا نه؟چجوریه ی توضیحی میدی! من تازه کارم پوزش:لبخند:

[aserfg]

ممنون دوست عزیز برای استفاده باید CSS را به گرید خود vs اضافه کنیم یا نه؟چجوریه ی توضیحی میدی! من تازه کارم پوزش:لبخند:
در فایل css مربوطه که دانلود کردی ابتدا به صفحه خودت ارتباط بده مثلا چندین فایل css ممکنه موجود باشه :
GlassBlackGridView.css
ChromeBlackGridView.css
و...
یکیش رو که می خوای استفاده کنی به صفحه خودت لینک کن (از سولوشن با دراگ به قسمت head صفحه بکش ) .
تا اینجا فایل css در صفحه شناسایی شده برای استفاده گرید ویو دارای صفات مختلفی است که این صفات رو به کلاسهای موجود در فایل css ست کن به این شکل:


<asp:GridView ID="GridView1" runat="server"
DataSourceID="SqlDataSource1" AutoGenerateColumns="False" Width="66px"
CssClass="GridViewStyle" DataKeyNames="ApplicationId" SelectedRowStyle-CssClass="SelectedRowStyle" RowStyle-CssClass="AltRowStyle" HeaderStyle-CssClass="HeaderStyle" PagerStyle-CssClass="PagerStyle" >