PDA

View Full Version : GridView با گوشه های کمانی (Rounded Gridview Corner)



maryam_80
سه شنبه 18 دی 1386, 04:50 صبح
با سلام

من می خواهم یک usercontrol درست کنم که در برگیرنده این Gridview باشد تا بتوانم به کرات از آن استفاده کنم
(C# 2005)

همان طور که در شکل می بینید گوشه سمت راست و چپ grid دارای قوس (کمان) می باشد .می خواستم بدانم که به چه شکل می توانم Grid موجود در شکل را پیاده سازی کنم

ممنون می شوم اساتید من را هر چه سریعتر راهنمایی کنند

maryam_80
سه شنبه 18 دی 1386, 06:47 صبح
نظری ، پیشنهادی ؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟؟ ؟؟

سار
سه شنبه 18 دی 1386, 08:52 صبح
رنک گریدیت رو با رنگ زمینه یکی کن بعد در دو گوشه بالا از دو تا عکس کمانی استفاده کن می شه همینی که فرستادی.

maryam_80
سه شنبه 18 دی 1386, 11:49 صبح
متاسفانه رنگ زمینه همانطور که می بینید سفید نیست در نتیجه این راه حل مناسبی نمی باشد

من از css استفاده کردم
یک style برای Header کل Grid ،یعنی TabHeader
یک style برای Header ستون اول که همان تصویر هست ،یعنی modtopleft
یک style برای ItemData ،یعنی TabData
و یک style هم برای کل Grid ،یعنی TabList

ولی متاسفانه Itemdata به Header خودش را override می کند



.tabHeader {
font-family: verdana,helvetica;
font-size: 10px;
color: #ffffff;
font-weight: bold;
text-decoration: none;
background-color: #990000;
}
.tabList {
border-width: 1px1px1px1px;
border-spacing: 0px;
border-style: solid;
border-color: #cccccc;
border-collapse: collapse;
background-color: #ffffff;
}
.tabData {
font-family: verdana,helvetica;
font-size: 10px;
font-weight: normal;
text-decoration: none;
}

.modtopleft {
background: #8E0000url(../imgs/module-top-left.gif)no-repeat;
width: 15px;
height: 22px;
}

raravaice
سه شنبه 18 دی 1386, 12:07 عصر
پیشنهاد من اینه که روی FIREFOX پلاگین FIREBUG رو دانلود کنی این یه دیباگر برای صفحات وب هست و بیبینی اون سایتی که این کارو کرده از چه روشی استفاده کرده.

این تاپیک هم شاید کمک باشه
http://barnamenevis.org/forum/showthread.php?t=89763&page=2
موفق باشی

maryam_80
چهارشنبه 19 دی 1386, 04:24 صبح
من برای حل کردن این مشکل یک table با دو سطر و سه ستون به فرمم اضافه کردم بعد:
1)سطر های ستون دوم را با هم merge کرده بعد grid را درون آن ستون قرار دادم
2) در سطر اول از ستونهای اول و سوم هم imageهای مربوطه را قرار دادم و valign=top

مشکل در این جا هست که به ازاء اضافه شدن هر رکورد به Grid ،من در سمت چپ و راست grid یک فضای خالی دارم در صورتیکه می خوام مثل عکس ضمیمه به صورت cell باشد

چه جوری می توانم طراحی کنم تا بتونم سطرهای کامل داشته باشم
یا اصلا میشه به ازاء هر ردیف موجود در grid به سطر دوم از ستون های اول و سوم جدولم هم یک cell اضافه کنم

من :گریه:

Bisavad_Moshtagh
چهارشنبه 19 دی 1386, 06:47 صبح
سلام،
من هنوز از Asp.net 1 استفاده میکنم اما تونستم این نمونه رو باDatagrid پیاده سازی کنم.
کارهایی که انجام دادم رو میگم، شاید بتونه کمکت کنه
1. Datagrid رو طوری تعریف کردم که ستون ابتدا و انتهایی Template Column باشه
2. توی Header هر ستون یک Table گذاشتم که دو ستون و یک سطر داشته باشه
3. سلولی که میخواستم هلالی باشه رو با Width مشخص و style مربوطه تنظیمش کردم و بقیه رو با رنگ مورد نظرم رنگش کردم
4. میمونه تنظیمات Border

maryam_80
چهارشنبه 19 دی 1386, 07:13 صبح
ممنون از راهنمایی
آیا ممکن است یک نمونه از کدتون را برام بذارید.
چون من در این ستون template می تونم فیلدهای مختلفی را bind کنم که هر کدوم دارای پهنای متفاوتی می باشند (چون این grid قرار است یک user control باشد)
و بعضی جاها اطراف عکس فضای خالی ایجاد می شود
؟؟؟

Bisavad_Moshtagh
چهارشنبه 19 دی 1386, 08:01 صبح
امیدوارم به دردتون بخوره
و امیدوارم بیشتر از من حوصله برای تنظیم Border ها و پاک کردن ضمیمه عکس ها و ... داشته باشید.
موفق باشید

maryam_80
دوشنبه 24 دی 1386, 04:31 صبح
با تشکر از راهنمایی مفید شما
پس از استفاده از لینک شما و انجام برخی دیگر از تغییرات مشکلم برطرف شد