Makale Özeti

Bu makalemizde uzun zamandır yokluğundan sıkıntı çektiğim bir problemini çözüme kavuşturuyor olacağım..Mobile projelerimizde kullanabileceğimiz bir ImageButton tasarlıyoruz..

Makale

                Bu makalemizde uzun zamandır yokluğundan sıkıntı çektiğim bir problemini çözüme kavuşturuyor olacağım..Nedir bu problem derseniz image alabilen bir button’ın henüz .NET CF’in içerisinde yer almıyor oluşu :) Test’leri biraz can sıkıcı olsa da bir müddet uğraştıktan sonra elimizde v0.1 beta diyebileceğimiz bir kontrolümüz oldu..İsmine cuteButtonFx dedim..Üzerimde sevindirici bir etki bıraktığından isminde Cute kelimesi geçiyor ama siz kendi “ticari olsun olmasın “ projenizde istediğiniz bir isimle istediğiniz gibi kullanabilirsiniz..

                Az laf çok icraat diyen bir insan olduğum için hemen koda geçelim ve ilgili kontrolümüzü tasarlayalım..

                Öncelikle Visual Studio içerisinden ;

 

resim1 bulunamadı!

                Yeni  kontrolümüzü oluşturmadan önce  (  ki Visual Studio 2008 den önce project template list bu aşamada görünüyordu.İlk defa Visual Studio 2008 mobile projesi oluşturacak olan arkadaşlar nerde diğer template’ler acaba eksik mi kurdum demesinler..Hepsi Smart Device Project altında toplandı...) ilgili projemizin adını veriyoruz..Biz öncelikle bir class library tipinde proje oluşturacağız..İsmini ben CuteButtonFX verip Ok diyorum..

 

resim2 bulunamadı!

İlgili proje’nin hedef platform bilgisi elimde deploy edip test edeceğim cihaz windows mobile 6.0 olduğu için Windows Mobile 6 Professional SDK ‘yi seçiyoruz.( 5 ve 2003 ile de test ettim herhangi bir sorunla karşılaşmadım..)Bu durumda geriye proje tipini ve ilgili FW versiyonunu seçmek kalıyor.Proje tipi Class Library olacak lakin FW tipi seçiminde özgürsünüz.FW’ye özgü birebir bağımlı bir kod yazmayacağız.

                Projenin kodları aşağıda ki gibidir.Satır aralarında neyi neden yaptığımı ifade etmeye calistim..

 

    public class CuteButtonFx : Control

    {

        private Bitmap backImage;  // ilgili zemin image’i

        private Bitmap originalBackGround; // aynı zemin resminin original hali.Üzerine text draw edeceğimiz için original halini saklı tutmamız gerekiyor..

        private SolidBrush brushText;  //Image’in üzerine basacağımız text’in rengini tutuyoruz..

        static System.Windows.Forms.Timer tmrMain = null; // eğer bu kontrolü windows forms application içerisinde kullanmak istersek design time ‘da resizing gerçekleşirken oluşan problemi engellemek için kullandım.Refresh problemlerinin giderilmesi için çok önemli..

 

        public CuteButtonFx()

        {

            tmrMain = new System.Windows.Forms.Timer(); // ilgili refresh timer’imizi ayağa kaldırıyoruz..

            tmrMain.Enabled = false; // açılışta enabled olmamalı!

            tmrMain.Tick += new EventHandler(tmrMain_Tick); // ilgili metodumuzu bağlıyoruz..

            BackColor = Color.FromArgb(2, 32, 154); //zemin rengi (şu aşamada kullanmıyoruz.)

            ForeColor = Color.White; // Yazı rengi.

            tmrMain.Interval = 1000; // refresh interval değeri.

            this._IsPaint = false; // resizing meydana geldiğinde durumu kotaracak olan değişken..

            if (File.Exists(@"c:\horizontal.jpg")) // bu kısım ilk etapda garip gelebilir ama mobile projede olsa design time ‘a yansıtacağı content image’i kendi device’inda değilde developing yapılan cihazda arıyor.. J Biz ilgili denetlemeleri kod’un içerisine koyacağız.Yoksa Visual Studio kendi kendini resetliyor..!!

            {

                this.BackgroundImageChange = new Bitmap(@"c:\horizontal.jpg"); // dediğimiz gibi sadece design time için..!

                this.BackgroundImageOriginal = new Bitmap(@"c:\horizontal.jpg"); // aynı şekilde.!

            }

            //else

            //throw new ArgumentException("Lütfen İlgili BackGround Image dosyasının path'inin doğru olup olmadığını kontrol edin!"); // eğer bu kısmı açarsak designer kayboluyor..ve yazdığımız hata geliyor..Dikkat!

            if (File.Exists(@"PROGRAM FILES\testFX1\horizontal.jpg")) // runtime denetleme.!

            {

                this.BackgroundImageChange = new Bitmap(@"PROGRAM FILES\testFX1\horizontal.jpg");

            }

            //else

            //throw new ArgumentException("Lütfen İlgili BackGround Image dosyasının path'inin doğru olup olmadığını kontrol edin!");

            brushText = new SolidBrush(Color.White); // yazımızın rengini set ediyoruz..

        }

 

        public Bitmap BackgroundImageChange // image değişiklerini izleyeceğimiz Property’imiz.

        {

            get

            {

                return this.backImage;

            }

            set

            {

                this.backImage = value;

            }

        }

 

        public Bitmap BackgroundImageOriginal // üzerine text draw ettiğimiz image’in orjinal halini tutuyoruz..Önemli!

        {

            get

            {

                return this.originalBackGround;

            }

            set

            {

                this.originalBackGround = value;

            }

        }

 

        public bool IsPaint // resizing’in de timer’i tetikleyecek ve onpaint’de gereksiz draw text’i engelleyecek olan property’imiz!

        {

            get

            {

                return this._IsPaint;

            }

            set

            {

                this._IsPaint = value;

            }

        }

 

        bool _IsPaint;

 

        public override Color BackColor // Zemin rengini tutuyoruz.

        {

            get { return base.BackColor; }

            set

            {

                base.BackColor = value;

            }

        }

 

        public override Color ForeColor // Yazı rengimiz.!

        {

            get { return base.ForeColor; }

            set

            {

                base.ForeColor = value;

                brushText = new SolidBrush(value);

            }

        }

 

        protected override void OnResize(EventArgs e) //resize meydana geldiğinde denetleme için!

        {

            base.OnResize(e);

            this._IsPaint = false;

            tmrMain.Enabled = true;

        }

 

        protected override void OnPaint(PaintEventArgs e)

        {

            if (backImage == null)

            {

                backImage = new Bitmap(ClientSize.Width, ClientSize.Height);

            }

 

            using (Graphics myPict = Graphics.FromImage(backImage)) // ana nokta.Burda ilgili olan kontrolün üzerine belirttiğimiz text değerini basıyoruz..ve nerede yer alacağını söylüyoruz..

            {

                if (!string.IsNullOrEmpty(Text) && this._IsPaint)

                {

                    SizeF size = myPict.MeasureString(Text, Font);

                    myPict.DrawString(

                      Text,

                      Font,

                      brushText,

                      (ClientSize.Width - size.Width) / 2,

                      (ClientSize.Height - size.Height) / 2);

                }

            }

            e.Graphics.DrawImage(backImage, 0, 0);

        }

 

        protected override void OnMouseDown(MouseEventArgs e)

        {

            base.OnMouseDown(e); // button etkisi vermenin yanı sıra ilgili olan kontrolün  event’larını denetliyoruz..

            this.Text = "** pressed **";

            using (Graphics myPict = Graphics.FromImage(backImage))

            {

                myPict.Clear(Color.Black); // basıldığında zemini siyah yapıyoruz ki basıldığı izlenimini verelim..!! dikkat!

            }

            Invalidate(); // tazele!

        }

 

        protected override void OnMouseUp(MouseEventArgs e)

        {

            base.OnMouseUp(e);

            this.Text = "** unpressed **"; //tıklanmış olan mouse’dan elimizi çektiğimizde zemini original image’ile yeniden çizdiriyoruz..!! Dikkat!

            if (File.Exists(@"PROGRAM FILES\testFX1\horizontal.jpg"))

            {

                this.BackgroundImageChange = new Bitmap(@"PROGRAM FILES\testFX1\horizontal.jpg");

            }

            //else

            //throw new ArgumentException("Lütfen İlgili BackGround Image dosyasının path'inin doğru olup olmadığını kontrol edin!");

            Invalidate(); // tazele!

        }

 

        protected override void OnTextChanged(EventArgs e)

        {

            base.OnTextChanged(e); // text değişiminde tazele!

 

            Invalidate();

        }

 

        private void InitializeComponent()

        {

            this.SuspendLayout();

            this.ResumeLayout(false);

        }

 

        private void tmrMain_Tick(object sender, EventArgs e)

        {

            tmrMain.Enabled = false; // resizing olduğunda orjinal resmi çizdirerek text’in doğru yerde belirmesini de sağlıyoruz.. burda onpaint i geçtiğimizde failure oluyor dikkat!

            this._IsPaint = true;

            using (Graphics myPict = Graphics.FromImage(backImage))

            {

                myPict.DrawImage(originalBackGround, 0, 0);

            }

            this.Refresh();

        }

    }

 

 

      

Ve...elimizde en son tasarladığımız kontrolün hem design ...

resim3 bulunamadı!

 

hemde runtime da ki halini görüyoruz..

 

resim4 bulunamadı!

Bastığımızda..

 

resim5 bulunamadı!

Umarım faydalı bir makale olmuştur..

Başka bir makalede görüşmek dileğiyle..

 

Kaynakça : MSDN

 

Eralp Erat

MVP – Mobile Devices

MCP,MCAD.NET,MCSD.NET

http://www.eralperat.com

HIMS