آموزش: استفاده از LinearGradientBrush

از LinearGrandientBrush برای رنگ کردن اشیاء رسم شده (از دکمه ها گرفته تا اشکالی مثل مستطیل و ...)بصورت گرادیانی استفاده میگردد بصورتی که رنگ مورد نظرشما از یک مقدار به مقدار دیگر(و درصورت نیاز آنهم به مقدار دیگر والی آخر) تغییر پیدا میکند. البته از LinearGrandientBrush تنها برای رسم پس زمینه استفاده نمیگردد. بلکه از آن میتوان برای رنگ پیش زمینه(Foreground) اشکال و یا رنگ حاشیه آنها نیز استفاده کرد.
LinearGrandientBrush دوخاصیت مهم به نامهای StartPoint و EndPoint دارد.همانطور که از نام آنها پیداست ، این دو، نقاط شروع و پایان رنگ آمیزی را مشخص مینمایند. مقدار پیشفرض برای StartPoint برابر "0,0"(گوشه بالا سمت چپ) و برای EndPoint برابر "1,1" (گوشه پایین سمت راست) میباشد که رنگ آمیزی آن بصورت مورب است.




بنابراین اگر مقدار StartPoint را 0.5,0.5 در نظر بگیریم رنگ آمیزی درست از مرکز مستطیل شروع میگردد.
برای درک بهتر محیط رنگ آمیزی،آن را شبیه یک جدول 2*2 (آرایه دوبعدی)تصور کنید. بصورتی که مقدار 0,0 به خانه اول از سطر اول،مقدار 1,0 به خانه دوم از سطر اول،مقدار 0,1 به خانه اول از سطر دوم و مقدار 1,1 هم به خانه دوم از سطر دوم اشاره میکند. حالا اگر بخواهید نحوه رنگ آمیزی از حالت مورب خارج شده و افقی شود StartPoint را برابر 1,0 و اگر میخواهید عمودی شود آنرا برابر 0,1 قرار دهید.
(با تمرین متوجه خواهید شد)
تصور کنید یک Rectangle رسم کرده اید و میخواهید با استفاده از LinearGrandientBrush پس زمینه ای به آن بدهید بصورتی که رنگ آن از آبی به سفید تغییر پیدا کند.خوب کار را شروع میکنیم.
همانطور که گفته شد می خواهیم رنگ پس زمینه Rectangle را تغییر دهیم.پس برای آن مینویسیم:

<Rectangle.Fill>

…………….

</Rectangle.Fill>

حالا کلاس LinearGrandientBrush را به همراه خصوصیات StartPoint و EndPoint به قسمت Fill اضافه میکنیم:

<Rectangle.Fill>

<LinearGradientBrush StartPoint ="0,0"  EndPoint="1,1" >

…………….

</LinearGradientBrush>

</Rectangle.Fill>

مرحله بعد و آخرین مرحله،اضافه کردن کلاس GradientStop میباشد. در هر کلاس GradientStop یک رنگ را میتوانید تعریف کنید. در این کلاس دو خاصیت وجود دارد. خاصیت Color برای تعریف رنگ وهمچنین خاصیت Offset که فاصله تغییر رنگ را نسبت به آخرین محل تعریف شده تعیین میکند.برای توضیح بیشتر اگر مقدار Offset اولین رنگ که مثلا زرد است برابر0 باشد و Offset دومین رنگ (قرمز) برابر 0.2 باشد،رنگ گرادیان در نقطه 0.2 کاملا قرمز است و از آن نقطه تا نقطه 0 به سمت زرد تغییر پیدا میکند.

<Rectangle.Fill>

<LinearGradientBrush StartPoint ="0,0"  EndPoint="1,1" >

<GradientStop Color="White" Offse="0"/>

<GradientStop Color="Blue" Offse="1"/>

</LinearGradientBrush>

</Rectangle.Fill>

بدون استفاده از WPF چنین ترسیمی نیازمند استفاده از فرمول شیب خط ریاضی به همراه تعداد زیادی کد دستورالعمل میباشد. ولی همانطور که ملاحظه میکنید در اینجا با 6 خط و به سادگی هرچه تمامتر(به قول عادل)اینکار رو انجام دادیم.

برای تمرین و بررسی بیشتر شما کدهای زیر رو امتحان کنید.

<Rectangle Width="150" Height="100">

<Rectangle.Fill>

<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">

<GradientStop Color="Yellow" Offset="0.0" />

<GradientStop Color="Red" Offset="0.25" />

<GradientStop Color="Blue" Offset="0.75" />

<GradientStop Color="LimeGreen" Offset="1.0" />

</LinearGradientBrush>

</Rectangle.Fill>

</Rectangle>

اگه کد زیر رو هم در قسمت دلخواه برنامتون اضافه کنید ،یک طرح کوچیک از پرچم کشور عزیزمون میافته گوشه طرحتون.

<LinearGradientBrush StartPoint="0,0" EndPoint="1,1">

<GradientStop Offset="0.0175" Color="Green" />

<GradientStop Offset="0.03" Color="White" />

<GradientStop Offset="0.04" Color="Red" />

<GradientStop Offset=".04" Color="CornflowerBlue" />

</LinearGradientBrush>

اگر در تاپیک مربوط به آموزش برنامه های کاربردی (در قسمت اعلان ها) این مطالب رو بگذارید فکر کنم بهتر باشه
و همچنین آموزش هاتون رو همراه با عکس هم بکنین خیلی خوب میشه.

ممنون و موفق باشید

نقل قول:

---

نوشته شده توسط bermooda

اگر در تاپیک مربوط به آموزش برنامه های کاربردی (در قسمت اعلان ها) این مطالب رو بگذارید فکر کنم بهتر باشه
و همچنین آموزش هاتون رو همراه با عکس هم بکنین خیلی خوب میشه.

ممنون و موفق باشید

---

با سلام.خیلی ممنون از راهنماییتون.ولی معذرت میخوام چنین چیزی رو پیدا نمیکنم...

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

نقل قول:

---

نوشته شده توسط bermooda

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

---

بازم سلام.خیلی خیلی معذرت میخوام. وارد بخشی که عنوان کردین شدم ولی هیچ امکانی برای اضافه کردن مقاله جدید وجود نداشت!