{"id":2826,"date":"2024-09-27T14:24:05","date_gmt":"2024-09-27T11:24:05","guid":{"rendered":"https:\/\/www.mikrobotik.com\/wp2\/?p=2826"},"modified":"2024-09-27T14:24:05","modified_gmt":"2024-09-27T11:24:05","slug":"app-inventor-animasyon_oled_tft_ekran-tasarimi","status":"publish","type":"post","link":"https:\/\/www.mikrobotik.com\/wp2\/2024\/09\/27\/app-inventor-animasyon_oled_tft_ekran-tasarimi\/","title":{"rendered":"APP INVENTOR ANIMASYON_OLED_TFT_EKRAN TASARIMI"},"content":{"rendered":"<p>&nbsp;<\/p>\n<p>Bu yaz\u0131mda ise CANVAS dedi\u011fimiz grafik ekranda neler yapabiliriz bunu anlataca\u011f\u0131m.<br \/>\nYaz\u0131n\u0131n ba\u015fl\u0131\u011f\u0131nda da g\u00f6rece\u011finiz gibi OLED ve TFT ekranlara at\u0131fta bulundum.<br \/>\nCANVAS bu tip grafik ekranlara benzer bir grafik ekrand\u0131r.<\/p>\n<p>CANVAS i\u00e7erisinde IMAGE SPRITE dedi\u011fimiz resimleri d\u00f6nd\u00fcrebiliyoruz. Ekran i\u00e7erisinde istedi\u011fimiz yerde g\u00f6r\u00fcnt\u00fcleyebiliyoruz. \u00d6rnek vermek gerekirse bir resim olarak ekrana bir saat kadran\u0131 koyup bu saat kadran\u0131n\u0131n \u00fczerinde LINE ile \u00e7izgiler \u00e7izerek analog saat elde edebiliyoruz. Bu komponenti kullanarak ekranda bir animasyon yapabiliyoruz. Hem ekranda kayd\u0131rabiliriz hem de ekranda d\u00f6nd\u00fcrebiliriz. Bu d\u00f6nd\u00fcrme ise 3 \u00e7e\u015fittir.<br \/>\n1-) Resmi sa\u011f yan\u0131ndan tutup \u00e7evirmek<br \/>\n2-) Resmi sol yan\u0131ndan tutup \u00e7evirmek<br \/>\n3-) Resmi ortadan d\u00f6nd\u00fcrmek.<br \/>\nBunun yan\u0131s\u0131ra <span style=\"color: #ff6600;\">VISIBLE ve INVISIBLE<\/span> \u00f6zelliklerini kullanarak istedi\u011fimiz zaman ekranda g\u00f6sterip istedi\u011fimiz zaman kaybedebiliriz.<\/p>\n<p>Bir ba\u015fka kullan\u0131labilecek blok <span style=\"color: #ff6600;\">CIRCLE<\/span> (daire) dir. Ekrana bir daire \u00e7izecekseniz <span style=\"color: #ff6600;\">X, Y<\/span> noktas\u0131n\u0131 belirtip bir de yar\u0131\u00e7ap\u0131n\u0131 vermelisiniz.<br \/>\nBunlar\u0131 verdi\u011finizde bir daire \u00e7izilecektir. <span style=\"color: #ff6600;\">TRUE<\/span> derseniz i\u00e7ini ayn\u0131 \u00e7izgi rengi ile dolduracakt\u0131r. <strong>FALSE<\/strong> derseniz sadece daire \u00e7izgisi \u00e7izilecektir.<br \/>\nFakat CANVAS bloklar\u0131n\u0131 kullanarak bu dairenin \u00e7izgisinin rengini ve kal\u0131nl\u0131\u011f\u0131n\u0131 ayarlayabilirsiniz.<\/p>\n<p><a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/daire.PNG?raw=true\" target=\"_blank\" rel=\"lightbox noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter lazyload\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/daire.PNG?raw=true\" alt=\"\" width=\"500\" height=\"333\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 500px; --smush-placeholder-aspect-ratio: 500\/333;\" \/><\/a><br \/>\nBununla birlikte SQUARE (kare) \u00e7izmek isterseniz <span style=\"color: #ff6600;\">bir blok yoktur.<\/span> Bunun yerine bir LIST blo\u011fu kullan\u0131larak 4 k\u00f6\u015fesinin koordinat\u0131 belirlenir ve bu L\u0130ST blo\u011funu DRAW SHAPE blo\u011funa ekleyerek 4 \u00e7izgi \u00e7izilerek KARE \u00e7izilmi\u015f olur. FILL k\u0131sm\u0131 TRUE olursa i\u00e7i dolu, FALSE olursa i\u00e7i BO\u015e bir kare \u00e7izilir.<br \/>\n\u00dc\u00c7GEN i\u00e7in ise yine ayn\u0131 metot kullan\u0131l\u0131r. Sadece L\u0130ST k\u0131sm\u0131nda 4 de\u011fil 3 koordinat ekseni bulunur. CANVAS bloklar\u0131 kullan\u0131larak hem \u00e7izilir, hem rengi belirlenir, hem de \u00e7izgi kal\u0131nl\u0131\u011f\u0131 belirlenir.<\/p>\n<p><a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/kare_ucgen.PNG?raw=true\" target=\"_blank\" rel=\"lightbox noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter lazyload\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/kare_ucgen.PNG?raw=true\" alt=\"\" width=\"294\" height=\"300\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 294px; --smush-placeholder-aspect-ratio: 294\/300;\" \/><\/a><br \/>\nEkrandaki a\u00e7\u0131l\u0131 \u00e7izgiler de DRAWLINE bloklar\u0131yla \u00e7izilir. \u00c7izgi kal\u0131nl\u0131\u011f\u0131 \u00e7izgi rengi ve a\u00e7\u0131s\u0131 blo\u011fa eklenerek ayarlan\u0131r. <span style=\"color: #ff6600;\">BLOK \u00fczerinde a\u00e7\u0131 olarak bir yer yoktur.<\/span> LINE \u00e7izilirken ba\u015flang\u0131\u00e7 noktas\u0131 verilir ve biti\u015f noktas\u0131 koordinatlar\u0131 verilir. Bu kordinatlara g\u00f6re de A\u00c7I belirlenmi\u015f olur. Fakat biz bunlar\u0131 \u00e7izerken TRIGONOMETRI den faydalanarak istedi\u011fimiz a\u00e7\u0131da ve istedi\u011fimiz uzunlukta bir \u00e7izgi \u00e7izebiliriz. A\u015fa\u011f\u0131daki resim bir for d\u00f6ng\u00fcs\u00fcne g\u00f6re \u00e7izilen \u00e7izgileri g\u00f6sterir. Bu \u015fekilde e\u015fit a\u00e7\u0131l\u0131 ve e\u015fit uzakl\u0131kta \u00e7izgiler \u00e7izebilirsiniz. X1 Y1 ba\u015flang\u0131\u00e7 noktas\u0131, X2 Y2 Biti\u015f noktas\u0131d\u0131r. ( en altta genel trigonometri form\u00fcl\u00fc anlat\u0131lm\u0131\u015ft\u0131r. )<\/p>\n<p><a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/DRAWLINE.PNG?raw=true\" target=\"_blank\" rel=\"lightbox noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter lazyload\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/DRAWLINE.PNG?raw=true\" alt=\"\" width=\"500\" height=\"333\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 500px; --smush-placeholder-aspect-ratio: 500\/333;\" \/><\/a><br \/>\nBunun yan\u0131s\u0131ra TEXT yazd\u0131rabiliyoruz. OLED ekranlardaki gibi yaz\u0131lar\u0131n\u0131z\u0131 yazabilirsiniz.<br \/>\nBu karakterlerin rengini, fontunu ve d\u00f6nme a\u00e7\u0131s\u0131n\u0131 ayarlayabilirsiniz. Yani ekranda sadece soldan sa\u011fa de\u011fil <span style=\"color: #ff6600;\">a\u015fa\u011f\u0131dan yukar\u0131<\/span> ya da <span style=\"color: #ff6600;\">yukar\u0131dan a\u015fa\u011f\u0131<\/span> da yaz\u0131 yazmak m\u00fcmk\u00fcn.<br \/>\nBunun yan\u0131s\u0131ra <span style=\"color: #ff6600;\">LEFT, RIGHT, CENTER<\/span> \u00f6zelli\u011fi ile de kelimeleri ekran \u00fczerinde ayarlayabiliyorsunuz. <span style=\"color: #ff6600;\">Fakat CENTER<\/span> \u00f6zelli\u011fi dedi\u011finizde ekran\u0131n tam ortas\u0131na gelmez. \u00e7\u00fcnk\u00fc bulunaca\u011f\u0131 X ve Y eksenini siz belirliyorsunuz. Buradaki CENTER kelimesi kelimenin ortas\u0131n\u0131 belirtir.<br \/>\n<span style=\"color: #ff6600;\"><strong>\u00d6RNEK<\/strong><\/span> kelimesini ele al\u0131rsak X ve Y noktas\u0131\u00a0 N harfinin bulundu\u011fu yerdir. bulundu\u011fu yerden sa\u011fa ve sola do\u011fru yazar. Ekran\u0131 ortalamaz. Kelimeyi ortalar.<\/p>\n<p><span style=\"color: #ff6600;\">DRAW TEXT<\/span> blo\u011funu kullanarak istedi\u011finiz yaz\u0131y\u0131 yazd\u0131rabilirsiniz. Ayr\u0131ca <span style=\"color: #ff6600;\">DRAW TEXT ANGLE<\/span> blo\u011funu kullanarak da istedi\u011finiz yaz\u0131y\u0131 belli bir a\u00e7\u0131 ile yazd\u0131rabilirsiniz.<br \/>\nYukar\u0131da da de\u011findi\u011fim gibi yaz\u0131n\u0131n fontunu, rengini ve a\u00e7\u0131s\u0131n\u0131 ayarlayabilirsiniz. A\u015fa\u011f\u0131daki\u00a0 resimde 2 kez ayn\u0131 yaz\u0131 yaz\u0131lm\u0131\u015f g\u00f6r\u00fcnse de eskisi silinip ki <span style=\"color: #ff6600;\">bunu yaz\u0131y\u0131 background renginde yazmakla yap\u0131yoruz<\/span> yeni yaz\u0131y\u0131 ise ba\u015fka bir renk ile ekrana yazd\u0131r\u0131yoruz. Bunu yapmasak t\u00fcm yaz\u0131lan yaz\u0131lar\u0131 arka arkaya g\u00f6r\u00fcrd\u00fck. O zaman d\u00f6nme efekti ortaya \u00e7\u0131kmazd\u0131. Fakat siz kendi uygulaman\u0131zda yazd\u0131\u011f\u0131n\u0131z yaz\u0131da animasyon yapmayacaksan\u0131z b\u00f6yle bir duruma gerek kalmayacakt\u0131r.<\/p>\n<p><img decoding=\"async\" class=\"alignleft lazyload\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/DRAW_TEXT.PNG?raw=true\" alt=\"\" width=\"275\" height=\"236\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 275px; --smush-placeholder-aspect-ratio: 275\/236;\" \/><img decoding=\"async\" class=\"alignright lazyload\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/DRAW_TEXT_ANGLE.PNG?raw=true\" alt=\"\" width=\"381\" height=\"211\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 381px; --smush-placeholder-aspect-ratio: 381\/211;\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>A\u015fa\u011f\u0131daki ekran\u0131 butona bast\u0131\u011f\u0131m\u0131zda elde ederiz. Butona bast\u0131\u011f\u0131m\u0131zda <span style=\"color: #ff6600;\">CLOCK enable<\/span> olur ve \u00e7al\u0131\u015fmaya ba\u015flayarak ekranda grafikleri ve animasyonlar\u0131 \u00e7izer ve g\u00f6sterir. Program kayna\u011f\u0131 basit tutulmu\u015ftur.<\/p>\n<p>&nbsp;<\/p>\n<figure style=\"width: 224px\" class=\"wp-caption alignleft\"><a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/ekran_web.jpg?raw=true\" target=\"_blank\" rel=\"lightbox noopener noreferrer\"><img decoding=\"async\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/ekran_web.jpg?raw=true\" alt=\"\" width=\"224\" height=\"398\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 224px; --smush-placeholder-aspect-ratio: 224\/398;\" \/><\/a><figcaption class=\"wp-caption-text\">WEB V\u0130EWER kullan\u0131larak internetten al\u0131nan saat ve kur tablosu<\/figcaption><\/figure>\n<p><a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/Ekran_goruntu.PNG?raw=true\" target=\"_blank\" rel=\"lightbox noopener noreferrer\"><img decoding=\"async\" class=\"alignnone lazyload\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/Ekran_goruntu.PNG?raw=true\" alt=\"\" width=\"253\" height=\"448\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 253px; --smush-placeholder-aspect-ratio: 253\/448;\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<figure style=\"width: 256px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/ekran_anim.jpg?raw=true\" target=\"_blank\" rel=\"lightbox noopener noreferrer\"><img decoding=\"async\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/ekran_anim.jpg?raw=true\" alt=\"\" width=\"256\" height=\"455\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 256px; --smush-placeholder-aspect-ratio: 256\/455;\" \/><\/a><figcaption class=\"wp-caption-text\">ekran\u0131n sol \u00fcst\u00fcndeki IMAGE SPRIR_TE animasyon alan\u0131 g\u00f6r\u00fcn\u00fcyor.<\/figcaption><\/figure>\n<p>Bu programda en altta bir WEB komponenti kullan\u0131l\u0131r. Bu komponent ile WEB sayfas\u0131 i\u00e7erikleri g\u00f6r\u00fcnt\u00fclenir ve gelen veriler i\u015flenebilir. ( Yukar\u0131daki ekran g\u00f6r\u00fcnt\u00fclerindeki gibi)<br \/>\nBen burada bir saat g\u00f6sterdim. Ayr\u0131ca ba\u015fka bir WEB VIEWER penceresinde de d\u00f6viz kurlar\u0131n\u0131 g\u00f6sterdim. Fakat sizler ba\u015fka gerekli bilgileri de burada g\u00f6sterebilirsiniz. Ayr\u0131ca bunlar\u0131 veri olarak al\u0131p, GRAF\u0130K ekran\u0131n\u0131zda da g\u00f6sterebilirsiniz.<\/p>\n<p><strong><span style=\"color: #ff0000;\">NOT:<\/span> <\/strong>CANVAS ekran\u0131n bir <span style=\"color: #ff0000;\">problemi<\/span> var. Ekran\u0131 yukar\u0131 a\u015fa\u011f\u0131 kayd\u0131rmak isterseniz bu canvas ekran\u0131na dokunarak bunu <strong>yapamazs\u0131n\u0131z<\/strong>. Bundan dolay\u0131 canvas ekran\u0131n\u0131 tam ekran kullanacaksan\u0131z yukar\u0131 a\u015fa\u011f\u0131 kayd\u0131rmay\u0131 iptal edin. \u015eayet canvas yan\u0131nda ba\u015fka komponentleri de ekranda g\u00f6sterecekseniz Canvas k\u0131sm\u0131n\u0131 ekran\u0131n %90 geni\u015fli\u011finde yaparsan\u0131z canvas\u0131n bo\u015f b\u0131rakt\u0131\u011f\u0131 yerden ekran\u0131 kayd\u0131rabilirsiniz. Programda %80 yaparak sa\u011f tarafta bo\u015fluk b\u0131rakt\u0131m.<\/p>\n<p>CANVAS blok k\u0131sm\u0131na bakarsan\u0131z birden fazla kullanabilece\u011finiz blok ile kar\u015f\u0131la\u015f\u0131rs\u0131n\u0131z. Bunlar\u0131n baz\u0131lar\u0131 \u00f6n plan rengi arka plan rengi gibi bloklard\u0131r. Ayr\u0131ca bu bloklar\u0131n yan\u0131s\u0131ra DRAWING komponentlerinde BALL diye bir komponent var bu ekranda bir daire \u015feklinde bir \u015fekil g\u00f6sterir. Bunun boyutunu ayarlayabilirsiniz istedi\u011finiz yere konumland\u0131rabilirsiniz isterseniz de ekranda hareketli top olarak g\u00f6sterebilirsiniz. rengini ve b\u00fcy\u00fckl\u00fc\u011f\u00fcn\u00fc siz belirlersiniz. \u0130sterseniz bir buton gibi kullanabilirsiniz isterseniz bir yeri ya da se\u00e7ileni i\u015faretlemek i\u00e7in kullanabilirsiniz.<br \/>\nCANVAS \u00f6zelliklerini kullanarak siz de APP INVENTOR i\u00e7inde denemeler yapabilirsiniz.<\/p>\n<p>Bu program ile beraber ba\u015fka bir program da bulacaks\u0131n\u0131z. (<span style=\"color: #ff6600;\">SAAT PROGRAMI<\/span>)<br \/>\nBu programda kendi haz\u0131rlad\u0131\u011f\u0131m\u0131z analog saat var. Bu saatin ekran b\u00fcy\u00fckl\u00fc\u011f\u00fcne g\u00f6re kendini ayarlamas\u0131 sa\u011fland\u0131. Dikey ekranda b\u00fcy\u00fck saat, yatay ekranda k\u00fc\u00e7\u00fck saat ayn\u0131 canvas i\u00e7erisinde \u00e7iziliyor. Bunun yap\u0131labilmesi i\u00e7in \u00f6ncelikle ekran\u0131n <span style=\"color: #ff6600;\">90 derece d\u00f6nd\u00fc\u011f\u00fcn\u00fc hissetmemiz laz\u0131m<\/span>.<br \/>\nBunu <span style=\"color: #ff6600;\">2<\/span> \u015fekilde yapabiliyorsunuz.<br \/>\n1-) <span style=\"color: #ff6600;\">SCREEN ORIENTATION<\/span> blo\u011funu kullan\u0131rs\u0131n\u0131z bu \u015fekilde d\u00f6nd\u00fc\u011f\u00fcn\u00fc anlars\u0131n\u0131z.<br \/>\n2-) <span style=\"color: #ff6600;\">IF blo\u011fu<\/span> ile <span style=\"color: #ff6600;\">SCREEN WIDTH<\/span> ile <span style=\"color: #ff6600;\">SCREEN HEIGHT<\/span> kar\u015f\u0131la\u015ft\u0131r\u0131l\u0131r. SCREEN WIDTH <span style=\"color: #ff6600;\">b\u00fcy\u00fckse<\/span> ekran 90 derece d\u00f6nm\u00fc\u015f demektir bu \u015fekilde ekran d\u00f6nd\u00fcyse siz de ayn\u0131 ekranda daha k\u00fc\u00e7\u00fck bir saat \u00e7izebilirsiniz. Bu saatin her \u015feyini kendimiz \u00e7izdi\u011fimiz i\u00e7in ( sin ve cos form\u00fcl\u00fc ile) ekranda yerle\u015ftirmek hi\u00e7 problem olmayacakt\u0131r. <strong>Resim kullanm\u0131\u015f olsak<\/strong> b\u00fcy\u00fck saat 90 derece d\u00f6nd\u00fc\u011f\u00fcnde elips \u015feklini alacakt\u0131r. Bundan dolay\u0131 resim kullanmad\u0131m.<\/p>\n<p>Bunun yan\u0131s\u0131ra her saniye ekran temizlenerek bu saati \u00e7iziyoruz. Bunun sebebi her saniye \u00e7izdi\u011fimiz saniye \u00e7ubu\u011funu silerek yeniden yaz\u0131lmas\u0131 i\u00e7indir.<br \/>\nBu \u015fekilde sadece saat ekran\u0131 varken bile cpu h\u0131z\u0131 ekran tazeleme esnas\u0131nda yava\u015f kalabiliyor belki de eski telefon oldu\u011fundan, saniye bazen atl\u0131yor. Saat yanl\u0131\u015f g\u00f6stermiyor fakat saniye \u00e7izgisi \u00e7izilemiyor. Bu da yava\u015fl\u0131ktan kaynaklan\u0131yor. Ekranda bir de yan\u0131nda ba\u015fka i\u015fler yap\u0131lacaksa iyice yava\u015flayarak saniye k\u0131sm\u0131 atlamalar\u0131 \u00e7o\u011falacakt\u0131r.<br \/>\n<strong><span style=\"color: #ff6600;\">Bunu \u00f6nlemenin bir ka\u00e7 yolu var.<\/span><\/strong><br \/>\n1-) Ekranda saat kadran\u0131 1 kez \u00e7izilir ve sadece akrep yelkovan ve saniye \u00e7ubuklar\u0131 her saniye \u00e7izilir. Bunu yapmak i\u00e7in eski \u00e7izimin silinmesi gerekir. T\u00fcm ekran\u0131 silmek yerine ekranda ayn\u0131 \u00e7izimi <span style=\"color: #ff6600;\">background rengi<\/span> ile yeniden \u00e7izmemiz, silinmesi i\u00e7in yeterli olacakt\u0131r. O zaman t\u00fcm ekran silinmedi\u011fi i\u00e7in ekranda yapt\u0131klar\u0131n\u0131z yerinde kalacak ve her saniye saat \u00e7izimi yap\u0131lmad\u0131\u011f\u0131 i\u00e7in saniye atlamas\u0131 olmayacakt\u0131r.<br \/>\n2-) Gerekirse saat ekran\u0131nda sadece akrep yelkovan g\u00f6sterilir saniye yerine bir \u0131\u015f\u0131kl\u0131 buton konulur bu yak\u0131p s\u00f6nd\u00fcr\u00fcl\u00fcr bu daha az zaman alacakt\u0131r. Fakat akrep ve yelkovan belli saniye aral\u0131klar\u0131nda kendi yerini de\u011fi\u015ftirerek ara de\u011ferlere gelmek zorunda. Bundan dolay\u0131 zaman\u0131 geldi\u011finde tetikleneceklerdir.<\/p>\n<p><span style=\"color: #ff6600;\"><strong>Not:<\/strong><\/span> Saat ekran\u0131nda saniye akrep yelkovan \u00e7izimlerinde kullan\u0131lan form\u00fcller saat i\u00e7in uygun olsa da ekran g\u00f6r\u00fcnt\u00fcs\u00fcnde g\u00f6rd\u00fc\u011f\u00fcn\u00fcz <span style=\"color: #ff6600;\">10 \u00e7izgiden olu\u015fan k\u0131rm\u0131z\u0131 \u00e7izimde<\/span> <strong>genel trigonometri<\/strong> form\u00fcl\u00fc kullan\u0131lm\u0131\u015ft\u0131r. Bu form\u00fcl ile LINE \u00e7izildi\u011finde yine benzer sonu\u00e7 \u00fcretilse de Genel olarak kullan\u0131lan form\u00fcl\u00fc kullanman\u0131z yerinde olacakt\u0131r. di\u011feri saat ekran\u0131 \u00e7izimi i\u00e7in yap\u0131lm\u0131\u015f. Bu form\u00fcllerde sin ve cos yerleri de\u011fi\u015fik hatta saat k\u0131sm\u0131nda -eksi ile \u00e7\u0131karma i\u015flemi yap\u0131lm\u0131\u015f fakat genel form\u00fclde b\u00f6yle bir i\u015flem yok.<\/p>\n<p>A\u015fa\u011f\u0131daki resimde soldan sa\u011fa i\u015flemlere bakacak olursan\u0131z.<br \/>\nEn soldaki ba\u015flang\u0131\u00e7 noktas\u0131 X ve Y de\u011feri bir sonraki \u00e7izilmesi gereken uzunluk daha sonra sin cos ifadeleri geliyor. sonraki ise a\u00e7\u0131d\u0131r. A\u015fa\u011f\u0131daki resim GENEL FORM\u00dcLD\u00dcR.<\/p>\n<p><a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/genelformul.PNG?raw=true\" target=\"_blank\" rel=\"lightbox noopener noreferrer\"><img decoding=\"async\" class=\"aligncenter lazyload\" data-src=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/blob\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\/PICTURE\/genelformul.PNG?raw=true\" alt=\"\" width=\"500\" height=\"333\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 500px; --smush-placeholder-aspect-ratio: 500\/333;\" \/><\/a><br \/>\n<strong><span style=\"color: #ff0000;\">Genel form\u00fcl \u015fu \u015fekildedir.<\/span><\/strong><br \/>\n<strong>Ad\u0131mlar:<br \/>\n<\/strong><strong>Ba\u015flang\u0131\u00e7 noktas\u0131<\/strong>: <span class=\"katex\"><span class=\"katex-mathml\">(x1,y1)(x_1, y_1)<\/span><span class=\"katex-html\" aria-hidden=\"true\"><span class=\"base\"><span class=\"mopen\">(<\/span><span class=\"mord\"><span class=\"mord mathnormal\">x<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">1<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mpunct\">,<\/span><span class=\"mord\"><span class=\"mord mathnormal\">y<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">1<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mclose\">)<br \/>\n<\/span><\/span><\/span><\/span><strong>\u00c7izgi uzunlu\u011fu (L)<\/strong>: Belirli bir uzunluk<br \/>\n<strong>A\u00e7\u0131 (\u03b8)<\/strong>: Verilen derece cinsinden a\u00e7\u0131<\/p>\n<p><strong>Form\u00fcller<\/strong>:<br \/>\nX eksenindeki biti\u015f noktas\u0131:<br \/>\n<span class=\"katex-html\" aria-hidden=\"true\"><span class=\"base\"><span class=\"mclose\"><span class=\"mord\"><span class=\"mord mathnormal\">x<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">2<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mrel\">=<\/span><span class=\"mord\"><span class=\"mord mathnormal\">x<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">1<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mbin\">+<\/span><span class=\"mord mathnormal\">L<\/span><span class=\"mbin\">\u22c5<\/span><span class=\"mop\">cos<\/span><span class=\"mopen\">(<\/span><span class=\"mord mathnormal\">\u03b8<\/span>)<\/span><\/span><\/span><\/p>\n<p>Y eksenindeki biti\u015f noktas\u0131:<br \/>\n<span class=\"base\"><span class=\"mord\"><span class=\"mord mathnormal\">y<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">2<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mrel\">=<\/span><\/span><span class=\"base\"><span class=\"mord\"><span class=\"mord mathnormal\">y<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">1<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mbin\">+<\/span><\/span><span class=\"base\"><span class=\"mord mathnormal\">L<\/span><span class=\"mbin\">\u22c5<\/span><\/span><span class=\"base\"><span class=\"mop\">sin<\/span><span class=\"mopen\">(<\/span><span class=\"mord mathnormal\">\u03b8<\/span><span class=\"mclose\">)<br \/>\n<\/span><\/span><strong>\u00d6rnek:<\/strong><br \/>\nBa\u015flang\u0131\u00e7 noktas\u0131 <span class=\"katex\"><span class=\"katex-mathml\">(20,10),<\/span><\/span>\u00a0a\u00e7\u0131 <span class=\"katex\"><span class=\"katex-mathml\">45<\/span><\/span>, ve uzunluk 50 piksel olsun<br \/>\n<span class=\"base\"><span class=\"mord\"><span class=\"mord mathnormal\">x<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">2<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mrel\">=<\/span><\/span><span class=\"base\"><span class=\"mord\">20<\/span><span class=\"mbin\">+<\/span><\/span><span class=\"base\"><span class=\"mord\">50<\/span><span class=\"mbin\">\u22c5<\/span><\/span><span class=\"base\"><span class=\"mop\">cos<\/span><span class=\"mopen\">(<\/span><span class=\"mord\">4<\/span><span class=\"mord\">5<span class=\"msupsub\"><span class=\"vlist-t\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mbin mtight\">\u2218<\/span><\/span><\/span><\/span><\/span><\/span><\/span><span class=\"mclose\">)<br \/>\n<span class=\"mord\"><span class=\"mord mathnormal\">y<\/span><span class=\"msupsub\"><span class=\"vlist-t vlist-t2\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mord mtight\">2<\/span><\/span><\/span><span class=\"vlist-s\">\u200b<\/span><\/span><\/span><\/span><\/span><span class=\"mrel\">=<\/span><span class=\"mord\">10<\/span><span class=\"mbin\">+<\/span><span class=\"mord\">50<\/span><span class=\"mbin\">\u22c5<\/span><span class=\"mop\">sin<\/span><span class=\"mopen\">(<\/span><span class=\"mord\">4<\/span><span class=\"mord\">5<span class=\"msupsub\"><span class=\"vlist-t\"><span class=\"vlist-r\"><span class=\"vlist\"><span class=\"sizing reset-size6 size3 mtight\"><span class=\"mbin mtight\">\u2218<\/span><\/span><\/span><\/span><\/span><\/span><\/span>)<\/span><\/span><\/p>\n<p>Yukar\u0131daki form\u00fcl\u00fc kullanarak ekranda a\u00e7\u0131s\u0131 ve boyu belli bir \u00e7izgiyi \u00e7izebilirsiniz.<\/p>\n<p><span style=\"color: #ff0000;\"><strong>GELD\u0130K NEDEN OLED EKRAN<\/strong> <\/span>gibi dedi\u011fimiz yere. Belki daha \u00f6nce hat\u0131rlars\u0131n\u0131z EASYLCD diye bir kart haz\u0131rlam\u0131\u015ft\u0131m. Bu kart ile K\u00dcT\u00dcPHANE olmadan LCD yi komutlarla kullanabilirsiniz demi\u015ftim. Bilmeyenler ise, <a href=\"https:\/\/www.mikrobotik.com\/wp2\/2018\/06\/27\/easylcd-hd44780-uyumlu-karakter-lcd-seri-modul\/\" target=\"_blank\" rel=\"noopener\"><strong>Bu sayfaya bakabilirler.\u00a0<\/strong><\/a><br \/>\nBu sayfadaki komut seti gibi bir komut seti haz\u0131rlad\u0131\u011f\u0131n\u0131zda telefonu bluetooth \u00fczerinden ya da wifi \u00fczerinden haberle\u015ftirerek komutunuzu g\u00f6nderirsiniz ve komut i\u015flenerek ekranda istedi\u011finiz i\u015flemi yapt\u0131rabilirsiniz.<br \/>\nEASYOLED diyelim. Ki bu daha haz\u0131r de\u011fil sadece bir d\u00fc\u015f\u00fcnce. Arduinoda oled kullan\u0131rken nas\u0131l ki daire \u00e7izimi i\u00e7in bir ba\u015flang\u0131\u00e7 noktas\u0131 ve radius denilen yar\u0131\u00e7ap veriyorsan\u0131z Burada da bir komut ile bunu g\u00f6nderebiliriz.<br \/>\n<strong><span style=\"color: #ff6600;\">\u00d6rnek :<br \/>\n<\/span><\/strong>OLED<span style=\"color: #ff0000;\">WR<\/span> X1,Y1,R diye g\u00f6nderebiliriz. Bu \u015fekilde istedi\u011fimiz yere bir daire \u00e7izeriz.<br \/>\nBunu geli\u015ftirirsek<br \/>\nOLED<span style=\"color: #ff0000;\">WR<\/span> X1,Y1,R,COLOR,FILL,LINE THICKNESS olarak geli\u015ftirerek daire \u00f6zelliklerini de verebiliriz. (FILL: i\u00e7ini doldurmak. LINETHICKNESS: \u00e7izgi kal\u0131nl\u0131\u011f\u0131 R=Radius=yar\u0131\u00e7ap. )<br \/>\nYa da ekranda analog saat \u00e7izilecek ise<br \/>\nOLEDWR CLK,X1,Y1,R yaz\u0131larak g\u00f6nderilirse bir Saat \u00e7izimi istenir ve bu \u015fekilde \u00e7izilebilir. Bunun gibi haz\u0131r resimlerde konulabilir mesela analog s\u0131cakl\u0131k g\u00f6stergesi gibi. O zaman yerini belirterek bundan istiyorum demeniz ya da rengini vermeniz yeterli olacakt\u0131r.<\/p>\n<p><span style=\"color: #ff0000;\">Neden EASYOLED dedi\u011fimizde<\/span> ise ARDUINO kullanmay\u0131p bir ESP01 kullanabilirsiniz ya da PC den ya da PIC i\u015flemciden g\u00f6ndermek isteyebilirsiniz. Bunun i\u00e7in ARDUINO k\u00fct\u00fcphanesini kullanamayabilirsiniz. Bundan dolay\u0131 genel ama\u00e7l\u0131 bir komut sistemi ile bunu K\u00dcT\u00dcPHANES\u0130Z olarak kullanmak m\u00fcmk\u00fcn olacakt\u0131r.<br \/>\n<span style=\"color: #ff6600;\"><strong>ESK\u0130 TELEFONLARINIZI<\/strong> <\/span>da ayn\u0131 zamanda dokunmatik OLED, TFT ekran gibi kullanabilirsiniz.<br \/>\nBunu nas\u0131l ba\u015far\u0131r\u0131z derseniz o da kolay. Ekranda bir noktaya dokundu\u011funuzda o noktan\u0131n hangi piksel oldu\u011funu ve hangi renk oldu\u011funu ARDUINOya bildirebilirsiniz.<br \/>\nBunu da OLEDRD READ komutuyla yapars\u0131n\u0131z. CANVAS \u00fczerine dokundu\u011funuzda bu dokunma bilgisini alabilirsiniz. Otomatik olarak bunu arduinoya g\u00f6nderebilirsiniz.<br \/>\nBu \u015fekilde baz\u0131 ekran d\u00fczenlemeleri de yap\u0131labilir. Ya da ekranda bir renk isteyerek o renk geliyorsa ekranda \u00e7izim halen duruyor demektir. ekran bozulmam\u0131\u015f demektir bunu kontrol edebilir.<\/p>\n<p><strong><span style=\"color: #ff0000;\">ESK\u0130 TELEFONLARINIZIN<\/span> <\/strong>ba\u015fka \u00f6zelliklerini de bu yolla arduino ile haberle\u015ftirerek telefonun sadece ekran\u0131n\u0131 de\u011fil di\u011fer \u00f6zelliklerini de ARDUINO ya g\u00f6nderebilirsiniz.<br \/>\nMesela ALARM saati i\u00e7in telefonu ayarlars\u0131n\u0131z. O saat geldi\u011finde telefon bu bilgiyi okur ve alarm \u00e7al\u0131\u015ft\u0131 diye ARDUINO yu uyar\u0131r. ALARM komutunu alan arduino belki ba\u015fka cihazlar\u0131n \u00e7al\u0131\u015fmas\u0131n\u0131 da yapabilir.<br \/>\nBunlar sadece belirledi\u011finiz KOMUT S\u0130STEM\u0130 ile yapabileceklerinizin bir b\u00f6l\u00fcm\u00fc.<br \/>\nA\u015fa\u011f\u0131daki<span style=\"color: #ff0000;\"><strong> L\u0130NKE TIKLAYARAK S\u0130TEMDEK\u0130 EASYLCD MOBIL<\/strong> <\/span>yaz\u0131lar\u0131ma bakarsan\u0131z kullan\u0131mlar\u0131n\u0131z\u0131 nas\u0131l artt\u0131rabilece\u011finizi g\u00f6rebilirsiniz.<br \/>\nBununla birlikte HAVA durumunu al\u0131p CANVAS ekran\u0131nda g\u00f6sterebilece\u011finiz gibi ARDUINO ya da bunu ileterek onunda hava durumuna g\u00f6re ayarlamas\u0131 gereken \u015feyleri ayarlamas\u0131n\u0131 sa\u011flayabilirsiniz. Mesela r\u00fczgar varsa TENTELER otomatik kapanacaksa bunu arduinno yapabilir. bunun benzeri \u015feyler i\u00e7in Arduinoya ESP ba\u011flaman\u0131za gerek kalmaz. Eski telefonunuzdan maksimum verim almaya odaklanabilirsiniz. Hatta <strong><span style=\"color: #ff6600;\">sesli komutlar<\/span><\/strong> ile arduino vas\u0131tas\u0131yla farkl\u0131 cihazlar\u0131 a\u00e7\u0131p kapatabilirsiniz.<\/p>\n<p><a href=\"https:\/\/www.mikrobotik.com\/wp2\/category\/easylcd_mobile\/\" target=\"_blank\" rel=\"noopener\"><strong>EASYLCDMOBIL SAYFALARI<\/strong><\/a><\/p>\n<p><a href=\"https:\/\/www.mikrobotik.com\/wp2\/?s=EASYLCD\" target=\"_blank\" rel=\"noopener\"><strong>EASYLCD SAYFALARI<\/strong><\/a><\/p>\n<p><strong>Ayr\u0131ca <a href=\"https:\/\/github.com\/safaka123\/Mikrobotik_yazilarim\/tree\/main\/APP_INVENTOR\/OLED_TFT_MOBIL\" target=\"_blank\" rel=\"noopener\">T\u00dcM DOSYALARI<\/a> buradan indirebilirsiniz<\/strong>.<\/p>\n<p><span style=\"color: #ff6600;\">Videoda her iki program\u0131n \u00e7al\u0131\u015fmas\u0131n\u0131 g\u00f6rebilirsiniz.<\/span><\/p>\n<p><iframe title=\"APP INVENTOR _OLD_PHONE_OLED_TFT\" data-src=\"https:\/\/www.youtube.com\/embed\/p_JaU0Ah59A\" width=\"694\" height=\"374\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" data-load-mode=\"1\"><\/iframe><br \/>\n&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; Bu yaz\u0131mda ise CANVAS dedi\u011fimiz grafik ekranda neler yapabiliriz bunu anlataca\u011f\u0131m. Yaz\u0131n\u0131n ba\u015fl\u0131\u011f\u0131nda da g\u00f6rece\u011finiz gibi OLED ve TFT ekranlara at\u0131fta bulundum. CANVAS bu tip grafik ekranlara benzer bir&#8230; <\/p>\n","protected":false},"author":1,"featured_media":2818,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,14,108,24],"tags":[],"class_list":["post-2826","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-arduino","category-easylcd","category-easylcd_mobile","category-mit-app-inventor-2"],"_links":{"self":[{"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/posts\/2826","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/comments?post=2826"}],"version-history":[{"count":3,"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/posts\/2826\/revisions"}],"predecessor-version":[{"id":2839,"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/posts\/2826\/revisions\/2839"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/media\/2818"}],"wp:attachment":[{"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/media?parent=2826"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/categories?post=2826"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mikrobotik.com\/wp2\/wp-json\/wp\/v2\/tags?post=2826"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}