آموزش تصویری #Visual C قسمت 2

[learninweb]

با سلام خدمت تمامی کاربران گرامی در زیر آموزش تصویری #Visual C را بررسی میکنیم توجه کنید که شما میتواند آموزش #Visual C را به همراه چند بخش آموزشی دیگر که بصورت شبیه سازی شده و تعاملی درس داده شده است و رایگان نیز میباشد از لینک آموزش #C دانلود کنید. در انتهای این آموزش تصویری نیز کل آموزش (هم متن و هم تصویری) در یک فایل PDF پیوست است.

در بخش قبل با ايجاد يک پروژه با محيط Visual C# آشنا شديد. در اين فصل با تکميل کردن پروژه بخش قبل با مفهوم شئ و كاربرد آن نيز آشنا مي‌‌شويم.
در Visual C# هر چيزي كه براي ساخت يك برنامه از آن استفاده مي‌كنيد، شئ ناميده مي‌شود. براي مثال در پروژه بخش قبل فرم و کنترل PictureBox دو شئ مختلف هستند.
هر شئ داراي يک سري خصوصيت مي‌باشد که با استفاده از آنها مي‌توانيم حالت شئ را تعيين کنيم. براي مثال با استفاده از خصوصيت Text شئ فرم مي‌توان تيتر فرم را تغيير داد. بعضي از خصوصيات فقط خواندني هستند مانند خصوصيت Height يك كنترل ComboBox كه قابل تغيير نمي‌باشد ولي قابل خواندن است.
در فصل قبل ياد گرفتيد كه چگونه خصوصيتهاي يك فرم را با استفاده از پنجره Properties تنظيم كنيد. در اين بخش مي‌خواهيم اين خصوصيتها را با استفاده از كد نويسي در Visual C# تغيير دهيم و بخوانيم.
در ادامه به بررسي يک مثال ساده مي‌پردازيم و در انتها اين فصل نيز برنامه فصل قبل را مقداري تکميل مي‌کنيم. براي ايجاد يک پروژه جديد روي دکمه New Project کليک کنيد.




مطابق تنظيمات اين صفحه يک پروژه تحت Windows به زبان Visual C# ايجاد مي‌شود. نام اين پروژه را App2 تعيين کرده‌ايم. روي دکمه OK کليک کنيد.




در اين برنامه مي‌خواهيم دو کنترل Button بر روي فرم قرار دهيم. روي کنترل Button در جعبه ابزار کليک کنيد.




اکنون بايد محل قرارگيري اين کنترل را تعيين کنيم. در قسمت مشخص شده توسط کادر قرمز کليک کنيد تا گوشه بالا و سمت چپ اين کنترل در اين قسمت قرار بگيرد.




مشاهده مي‌کنيد که يک کنترل Button به صفحه اضافه شده است. مي‌خواهيم يک کنترل ديگر نيز به صفحه اضافه کنيم. روي کنترل Button در جعبه ابزار کليک کنيد.




در محل مشخص شده کليک کنيد.




اکنون دو کنترل بر روي فرم قرار دارند. اين دو کنترل هر کدام يک شئ هستند و داراي خصوصياتي هستند که از طريق کدنويسي يا پنجره Properties قابل تنظيم است. اکنون در زمان طراحي برنامه هستيم. در زمان طراحي برنامه مقدار خصوصيات بايد از طريق پنجره Properties تعيين شود ولي در زمان اجراي برنامه مقدار خصوصيات يک شئ از طريق کد نويسي خوانده شده يا تغيير داده مي‌شود.
در اين برنامه مي‌خواهيم با کليک بر روي يک دکمه فرم بزرگ و با کليک بر روي دکمه ديگر فرم کوچک شود. ابتدا خصوصيات دو کنترل Button را در زمان طراحي تعيين مي‌دهيم و سپس با استفاده از کد نويسي با کليک بر روي هر دکمه مقدار خصوصيت ابعاد فرم را تغيير مي‌دهيم تا فرم بزرگ و کوچک شود.
با استفاده از خصوصيت Text کنترل Button مي‌توانيد متني که بر روي کنترل نوشته مي‌شود را تغيير دهيد. روي مقدار خصوصيت Text دابل کليک کنيد.




در ادامه عبارت Big را وارد مي‌کنيم.
روي کنترل Button اول کليک کنيد.




روي مقدار خصوصيت Text دابل کليک کنيد.




عبارت Small را به عنوان مقدار اين خصوصيت وارد کرده‌ايم. دکمه Enter صفحه کليد را فشار دهيد.

---

تا اينجا در زمان طراحي فرم مقدار دو خصوصيت کنترل را تغيير داديم. حال مي‌خواهيم وارد قسمت برنامه‌نويسي شده و کد مربوط به تغيير خصوصيات در زمان اجراي برنامه را وارد نمائيم. روي دكمه Small دابل كليك كنيد تا وارد كد کليک بر روي اين دکمه بشويم.




اکنون در قسمت كد رويداد كليك بر روي دكمه Small قرار داريم. کدي که در اين قسمت وارد مي‌کنيد زماني اجرا مي‌شود که کاربر بر روي دکمه Small کليک کند. عبارت button1_Click نشان دهنده رويداد کليک بر روي کنترل button1 است با استفاده از خصوصيت Name مي‌توانيد نام هر کنترل را تغيير دهيد. در فصل بعد با رويدادها بيشتر آشنا مي‌شويد. روي دکمه Auto Hide کليک کنيد تا صفحه جعبه ابزار مخفي شود.




عبارت this كه نشان دهنده اين فرم مي‌باشد را تايپ كنيد.




مشاهده مي‌کنيد که با فشردن دکمه t بصورت خودکار ليستي از دستورات نمايش داده شده است و بر روي اولين دستوري که با حرف t شروع مي‌شود، يعني دستور this قرار داريم. اکنون دستور this انتخاب شده است با فشردن کاراکترهاي غير حرفي بصورت خودکار دستور تايپ مي‌شود. كاراكتر . را وارد كنيد.




براي جستجوي خصوصيت Width كليد W را فشار دهيد.
اكنون گزينه خصوصيت Width انتخاب شده است. كليد Tab را فشار دهيد تا اين خصوصيات بر روي صفحه نوشته شود. توجه كنيد كه اگر در اين حالت كليد Space را فشار دهيد علاوه بر اين كه كلمه Width بر روي صفحه نوشته مي‌شود يك فاصله نيز بعد از كلمه Width وارد مي‌شود.




با استفاده از عبارت وارد شده به عرض فرم كنوني دسترسي پيدا كرديم. خط قرمزي که در انتهاي دستور است نشان دهنده يک خطا است ماوس را مي‌توانيد بر روي اين خط قرمز ببريد تا خطا را مشاهده کنيد. اين خطا بهخاطر قرار نداشتن کاراکتر ; در انتهاي دستور است ولي اين خط کد هنوز تمام نشده است که بخواهيم کاراکتر ; را وارد کنيم. در ادامه بقيه كد را وارد مي‌كنيم.
در اين كد مقدار كنوني خصوصيت عرض فرم كه توسط يك خط آبي مشخص شده است از عدد صد کسر شده و سپس در خصوصيت عرض فرم كه توسط خط سبز مشخص شده است، ذخيره مي‌شود. يعني پس از كليك بر روي اين دكمه عرض فرم صد واحد کاهش مي‌يابد. در زبان C# در انتهاي هر خط دستور بايد کاراکتر ; را وارد نمائيد. اکنون در انتهاي دستور قرار داريم کاراکتر ; را تايپ کنيد.




با وارد کردن کاراکتر ; بصورت خودکار بين کاراکترهاي مساوي، منها و نام خصوصيات فاصله ايجاد شده است. اين فاصله باعث افزايش خوانايي برنامه مي‌شود.
توسط دستور وارد شده مقدار خصوصيت ارتفاع فرم صد واحد کاهش مي‌يابد. روي برگه Form1.cs[Design] كليك كنيد تا وارد پنجره طراحي فرم بشويم.




روي دكمه Big دابل كليك كنيد.




در ادامه كد مربوط به اين دكمه را وارد مي‌كنيم.
با كليك بر روي اين دكمه ارتفاع و عرض فرم صد واحد افزايش مي‌يابد و در نتيجه فرم بزرگتر مي‌شود. پس در اين برنامه با كليك بر روي دكمه Big فرم بزرگتر شده و با كليك بر روي دكمه Small فرم كوچكتر مي‌شود. براي اجراي برنامه روي دكمه Start كليك كنيد.




روي دكمه Big كليك كنيد تا فرم بزرگ شود.

---

با کليک بر روي دکمه Big خصوصيات فرم در زمان اجراي برنامه خوانده شده و سپس تغيير داده شده است. پس اين خصوصيات اکنون در زمان اجرا تغيير يافته و فرم بزرگ‌تر شده است. روي دكمه Small كليك كنيد تا فرم کوچک شود.




روي دکمه Close کليک کنيد.




علاوه بر خصوصيات, اشياء داراي متد نيز هستند. متدها عملياتي هستند كه شئ مي‌تواند انجام دهد. متدها به شكل توابع مي‌باشند. يک متد مي‌تواند داده‌اي را دريافت کند يا داده‌اي را بعنوان خروجي برگرداند. فراخواني يك متد مانند اشاره به مقدار يك خصوصيت است. ابتدا نام شئ را وارد مي‌كنيم سپس يك كاراكتر نقطه و در ادامه نام متد را وارد مي‌كنيم.
در اينجا مي‌خواهيم به بررسي يک متد ساده بپردازيم. دکمه Enter صفحه کليد را فشار دهيد تا در خط بعد دستور مورد نظر را وارد کنيم.




همانطور که بيان شد نام اين کنترل Button2 است. براي آنکه بتوانيم خصوصيات يا متدهاي اين کنترل را بخوانيم، تغيير دهيم يا فراخواني کنيم بايد نام کنترل را وارد کنيد. هميشه سعي کنيد که نام کنترل را يک نام با معني انتخاب نمائيد تا در کد نويسي دچار اشتباه نشويد. در اين مثال چون دو کنترل در فرم وجود دارد کار با آنها ساده است ولي اگر چندين کنترل در يک فرم وجود داشته باشد شناسائي وظيفه هر کنترل مقداري پيچيده مي‌شود. همانطور که بيان شد با استفاده از خصوصيت Name در پنجره Properties مي‌توانيد نام يک کنترل را تغيير دهيد.
عبارت button2 را وارد نمائيد.




با وارد کردن دو حرف b و u بر روي گزينه button1 قرار داريم. براي انتخاب گزينه button2 روي گزينه button2 کليک کنيد.




کاراکتر نقطه را وارد کنيد.




حرف H را وارد کنيد.




در اين ليست سه گروه گزينه وجود دارند. يک گروه مانند Height خصوصيت هستند، يک گروه مانند Hide متد مي‌باشند و گروه سوم مانند HelpRequested رويدادهائي هستند که ممکن است رخ دهد. اين سه گروه توسط سه نوع آيکون متفاوت نمايش داده مي‌شوند. روي گزينه Hide دابل کليک کنيد.




توسط متد Hide ديگر اين کنترل بر روي فرم نمايش داده نمي‌شود. توجه کنيد که بعد از نام متد Hide دو کاراکتر ( و ) وارد کرده‌ايم. در انتهاي نام متد هميشه بايد اين دو کاراکتر را وارد کنيم. کاراکتر ; را وارد کنيد.




هر شئ شامل مقداري کد است که شما به آن دسترسي نداريد. براي مثال شئ button با استفاده از کدهائي که نوشته شده است عمل مي‌کند. در اين کدها يک يا چندين متغير و تابع نيز وجود دارد که شما مي‌توانيد آنها را استفاده کنيد تا مقدار يک متغير موجود در کد شئ را بخوانيديا مقداردهي کنيد يا يک تابع موجود در کد شئ را فراخواني نمائيد.
براي مثال در شئ button يک متغير به نام Text وجود دارد که از خارج از شئ قابل مقدار دهي و خواندن است. با استفاده از اين متغير کد داخل شئ button متن روي کنترل را تعيين مي‌کند. به همين ترتيب نيز شئ button داراي يک تابع به نام Hide است که وظيفه آن عدم نمايش کنترل مي‌باشد با استفاده از دستور button2.Hide تابع hide موجود در شئ button را فراخواني مي‌کنيد.
اصطلاحاً به هر متغير شئ که به آن دسترسي داريد خصوصيت و هر تابع قابل دسترسي متد گفته مي‌شود.
در ادامه اين بخش مي‌خواهيم برنامه فصل قبل را کاملتر کنيم تا در زمان اجرا کاربر بتواند يک تصوير را انتخاب کند تا درکنترل PictureBox نمايش داده شود.
براي بستن اين پروژه منوي File را باز کنيد.

---

روي گزينه Close Solution کليک کنيد.




براي ذخيره پروژه روي دکمه Yes کليک کنيد.




روي گزينه FirstApp کليک کنيد، تا اين پروژه باز شود.




اکنون بايد يک کنترل button به صفحه اضافه کنيم. ماوس را روي برگه Toolbox ببريد.




روي کنترل Button کليک کنيد.




دکمه Escape صفحه کليد را فشار دهيد، تا منو بسته شود.
در محل مشخص شده بر روي فرم کليک کنيد.




روي مقدار خصوصيت Text دابل کليک کنيد.




در ادامه عبارت Open را وارد مي‌کنيم.
دکمه Enter صفحه کليد را فشار دهيد.
براي تغيير نام کنترل PictureBox، روي کنترل PictureBox کليک کنيد.




روي مقدار خصوصيت (Name) دابل کليک کنيد.




اکنون عبارت PB را وارد کرده‌ايم. دکمه Enter صفحه کليد را فشار دهيد.
مي‌خواهيم حاشيه اين كنترل را تغيير دهيم. اين کار توسط خصوصيت Border Style انجام مي‌شود. روي ميله لغزان کليک کنيد تا به خصوصيت Border Style برسيم.

---

روي خصوصيت Border Style کليک کنيد.




ليست بازشونده اين خصوصيت را باز كنيد.




روي گزينه Fixed Single كليك كنيد.




مشاهده مي‌کنيد که يک خط مشکي در دور کنترل رسم شده است.
اگر ابعاد تصويري که مي‌خواهيد در اين کنترل نمايش دهيد بزرگتر از ابعاد کنترل باشد تمام تصوير نمايش داده نمي‌شود. براي آنکه تعيين کنيم تصوير به چه صورت در کنترل نمايش داده شود از خصوصيت SizeMode استفاده مي‌کنيم. روي ميله لغزان کليک کنيد تا به اين خصوصيت برسيم.




روي خصوصيت SizeMode کليک کنيد.




ليست باز شونده اين خصوصيت را باز کنيد.




روي گزينه Stretch Image كليك كنيد، تا تصوير به اندازه كنترل گسترش يابد.




تا كنون تمامي كنترل‌هايي كه استفاده كرديم در زمان اجرا نمايش داده مي‌شوند. ولي اكنون مي‌خواهيم كنترلي روي فرم قرار دهيم كه در هنگام اجراي برنامه توسط كاربر قابل رويت نيست. براي اينكه به كاربر اجازه دهيد تا يك تصوير را براي نمايش انتخاب كند لازم است كه به او قابليت جستجو و نشان دادن فايل‌هاي موجود در كامپيوتر را بدهيد. كنترلي كه به كاربر اين اجازه را مي‌دهد كنترل OpenfileDialog مي‌باشد. ماوس را بر روي Toolbox ببريد.




کنترل OpenfileDialog در گروه Dialogs کنترلها قرار دارد.
روي کنترل OpenFileDialog دابل کليک کنيد تا به فرم اضافه شود.




مشاهده مي‌كنيد كنترل OpenFileDialog در قسمت پايين صفحه قرار گرفته است. تمامي كنترلهايي كه در زمان اجرا توسط كاربر ديده نمي‌شوند در اين قسمت قرار مي‌گيرند. روي خصوصيت Name كليك كنيد.

---

عبارت SelFile را بعنوان نام اين شيء وارد کرده‌ايم.
روي خصوصيت Filter كليك كنيد.




در ادامه عبارت زير را وارد مي‌كنيم تا فقط فايلهاي JPGو BMP نمايش داده شوند.
Windows Bitmaps|*.bmp|JPEGFiles|*.JPG‌
از خصوصيت Filter جهت تعيين پسوند فايلهائي که اين کنترل مي‌تواند نمايش دهد استفاده مي‌شود. براي مثال در اينجا تعيين كرده‌ايم كه فقط فايلهائي با پسوند BMP و JPG نمايش داده شوند متني كه قبل از علامت | ظاهر مي‌شود متن توضيح نوع فايل و متني كه بعد از علامت | مي‌آيد الگويي است كه طبق آن فايل‌ها فيلتر مي‌شوند. براي مثال در اينجا دو گزينه بايد نمايش داده شود كه در گزينه اول متن Windows Bitmaps نمايش داده شده و با انتخاب آن فقط فايلهايي كه داراي پسوند BMP مي‌باشند نمايش داده مي‌شوند. اكنون رابط گرافيكي يا ظاهر برنامه طراحي شده است و نوبت به نوشتن کد رسيده است.
Windows Bitmaps|*.bmp|JPEGFiles|*.JPG‌
اين کنترل داراي چندين خصوصيت ديگر نيز مي‌باشد که در کد نويسي آنها را مقداردهي مي‌کنيم.
در اولين كد مي‌خواهيم به كاربر اجازه دهيم تا در كامپيوتر خود يك فايل با پسوند BMP يا JPG را انتخاب كند تا در كنترل Picture Box نمايش داده شود. اين كد زماني اجرا مي‌شود كه كاربر روي دكمه Open كليك كند. روي دكمه Open دابل كليك كنيد.




در اين قسمت ممكن است كد‌هاي برنامه را متوجه نشويد ولي در فصلهاي بعد كه با ساختارهاي كدنويسي آشنا شديد كاملاً عملياتهاي انجام شده در اين فصل را درك خواهيد كرد. در ادامه كد برنامه را وارد مي‌كنيم.
در زير مي‌توانيد اين کد را مشاهده کنيد.
SelFile.Title = "Select a Picture";
SelFile.FileName = "";
if (SelFile.ShowDialog() == DialogResult.OK)
PB.Image = Image.FromFile(SelFile.FileName);
this.Text = SelFile.FileName;
در دو خط اول اين کد دو خصوصيت کنترل SelFile را مقداردهي کرده‌ايم. توسط خصوصيت Title تيتر پنجره‌اي که توسط آن فايل تصوير را انتخاب مي‌کنيد تعيين مي‌شود. با استفاده از خصوصيت FileName مي‌توانيد يک نام فايل پيش فرض تعيين کنيد.




در خط سوم برنامه، از ساختار شرطي if استفاده شده است. در اين ساختار, شرطي وجود دارد كه اگر كاربر يک فايل را انتخاب کرد آنگاه شرط درست بوده و کد داخل ساختار if اجرا مي‌شود.




در خط چهارم بيان شده است كه تصوير انتخاب شده توسط كنترل OpenFileDialog در Picturebox نمايش داده شود. در فصلها‌ي آينده با نحوه كد‌نويسي برنامه‌ها كاملاً آشنا خواهيد شد.




توسط خط آخر نام و آدرس فايل در قسمت تيتر پنجره نمايش داده مي‌شود. براي اجراي برنامه روي دكمه Start كليك كنيد.




برنامه اجراء شده است. روي دكمه Open كليك كنيد.




اکنون گزينه Windows BMP انتخاب شده است و فقط فايلهائي با پسوند BMP نمايش داده مي‌شوند. در قسمت تيتر پنجره عبارتي که توسط خصوصيت Title تعيين کرديم نمايش داده شده است. روي فايل Coffee Bean.bmp دابل كليك كنيد.




مشاهده مي‌کنيد که تصوير نمايش داده شده و نام و آدرس تصوير نيز در تيتر پنجره نمايان شده است. در اين فصل هدف آشنائي و کار با اشياء، متدها و خصوصيات بود. در فصلهاي بعدي به بررسي بيشتر رويدادها، کنترلها، کد نويسي و ... خواهيم پرداخت.




شما میتواند آموزش #Visual C را به همراه چند بخش آموزشی دیگر که بصورت شبیه سازی شده و تعاملی درس داده شده است و رایگان نیز میباشد از لینک آموزش #C دانلود کنید.
شما اکنون در پايان اين فصل قرار داريد.