⌨
Keycode Info
Klavye tuş kodlarını ve olay bilgilerini gerçek zamanlı görüntüleyin. Geliştirme süreçlerinizde tuş detaylarını kolayca inceleyin.
❓Keycode Info Nedir
Keycode Info, JavaScript KeyboardEvent API'sini kullanarak klavye girişlerini yakalar ve key, code, modifier tuşları gibi bilgileri gösterir. Uluslararası klavye düzenleri ve özel tuşları destekleyen araç; kısayollar, form doğrulama, oyun kontrolleri ve erişilebilirlik gibi senaryolarda kullanılır.
✨Öne Çıkan Özellikler
⌨️
Gerçek Zamanlı Tuş Algılama
Klavye olaylarını anlık olarak yakalayın ve analiz edin; farklı tarayıcı ve platformlarda tuş basma, bırakma ve kombinasyonları anında görüntüleyin
🔍
Detaylı Tuş Bilgileri
Tuş kodu, tuş adı, code değeri, konum ve modifiye tuş durumları dahil kapsamlı bilgileri görüntüleyin
🌐
Tarayıcılar Arası Uyumluluk
Chrome, Firefox, Safari ve Edge dahil tüm popüler tarayıcılarda tutarlı sonuçlar alın
🛠️
Geliştirici Dostu
Klavye olayları, oyun geliştirme, erişilebilirlik ve kısayol uygulamaları üzerinde çalışan geliştiriciler için ideal araç
🎯
Uygulama senaryoları
🎯
Klavye kısayolu geliştirme
Web uygulamaları, metin düzenleyiciler ve üretkenlik araçlarında özel klavye kısayolları uygulayın. Tuş kombinasyonlarını, değiştirici tuşları test edin ve kısayol işlevselliği için tarayıcılar arası uyumluluğu sağlayın.
💼
Oyun kontrolü uygulama
Klavye girişi kullanarak oyun kontrolleri geliştirin. Tuşları oyun eylemlerine eşleyin, eşzamanlı tuş basışlarını işleyin ve oyun uygulamaları için ok tuşları, WASD kontrolleri ve özel işlev tuşlarını test edin.
🏢
Form navigasyonu ve etkileşim
Klavye desteği ile erişilebilir form navigasyonu oluşturun. Tab tuşu navigasyonu, Enter tuşu gönderimi, Escape tuşu iptali ve açılır menüler ve listeler için ok tuşu navigasyonunu uygulayın.
👥
Erişilebilirlik testi
Ekran okuyucular ve yardımcı teknolojiler için klavye erişilebilirlik özelliklerini test edin. Yalnızca klavye navigasyonunu, odak yönetimini doğrulayın ve tüm etkileşimli öğelerin klavye ile erişilebilir olduğundan emin olun.
🔧
Klavye olayı hata ayıklama
Web uygulamalarındaki klavye ile ilgili sorunları hata ayıklayın. Yanlış tuş kodlarını tanımlayın, değiştirici tuş kombinasyonu sorunlarını giderin ve farklı tarayıcılar ve klavye düzenlerinde olay işlemeyi doğrulayın.
📋Kullanım Rehberi
Adım 1: Dinlemeyi Başlatın
"Dinlemeyi Başlat" düğmesine tıklayarak klavye olaylarını yakalamaya başlayın.
Adım 2: Tuşa Basın
Klavyenizde herhangi bir tuşa basın; araç tuşu anında algılayarak ilgili tüm bilgileri toplar.
Adım 3: Sonuçları İnceleyin
Key code, code, konum, modifiye tuşları ve zaman damgası gibi detaylı bilgileri görüntüleyin.
📚Teknik Tanıtım
⌨️Klavye Tuş Kodları Nedir
Klavye tuş kodları, işletim sistemlerinin ve uygulamaların hangi tuşa basıldığını anlaması için kullanılan sayısal tanımlayıcılardır. Fiziksel tuş kodları, karakter kodları ve sanal tuş kodları farklı kullanım alanlarına sahiptir.
🔍Klavye Olaylarını Algılama
Klavye olaylarının algılanması, tuşa basma/bırakma gibi olayları tarayıcı API'leri ve sistem dinleyicileriyle yakalamayı içerir. KeyboardEvent API, key, code, modifier tuşları ve zaman bilgisini sağlar.
🌐Platformlar Arası Uyumluluk
Klavye düzenleri, işletim sistemleri ve tarayıcılar arasında tuş kodları değişiklik gösterebilir. KeyboardEvent API bu farklılıkları normalize etmeye çalışsa da geliştiricilerin özel durumları dikkate alması gerekir.
🛠️Geliştirme ve Hata Ayıklama
Tuş kodu bilgileri; web geliştirme, oyun yapımı, erişilebilirlik testi ve kısayol yönetimi için kritiktir. Bu araç, gerçek zamanlı tuş algılama ve ayrıntılı olay bilgileriyle geliştirme süreçlerini hızlandırır.
❓
Sıkça Sorulan Sorular
❓
Keycode nedir ve neden bu araca ihtiyacım var?
Keycode, bir klavyedeki her tuşa atanan sayısal bir tanımlayıcıdır. Bu araç, geliştiricilerin keycode ları, tuş adlarını, değiştirici durumlarını ve olay ayrıntılarını gerçek zamanlı olarak göstererek klavye olaylarını anlamalarına yardımcı olur. Klavye kısayollarını uygulamak, form navigasyonunu işlemek, oyun kontrollerini yönetmek ve web uygulamalarındaki klavye ile ilgili sorunları ayıklamak için gereklidir.
💬
key, keyCode ve code özellikleri arasındaki fark nedir?
"key" özelliği karakter değerini temsil eder (ör. "a", "Enter"). "keyCode" (kullanımdan kaldırılmış) sayısal bir tanımlayıcıydı. "code" özelliği fiziksel tuş konumunu temsil eder (ör. "KeyA", "EnterLeft"). Modern kod, daha iyi tarayıcılar arası uyumluluk için kullanımdan kaldırılmış "keyCode" ve "which" özellikleri yerine "key" ve "code" kullanmalıdır.
🔍
Keycode lar neden tarayıcılar ve işletim sistemleri arasında farklılık gösterir?
Keycode lar, farklı işletim sistemleri ve klavye düzenlerinin tuşlara farklı sayısal değerler ataması nedeniyle değişebilir. KeyboardEvent API, bu farklılıkları ele almak için normalleştirilmiş "key" ve "code" özellikleri sağlar. Bu araç, uygulamanızın aldığı gerçek değerleri görmenize yardımcı olur, bu da platformlar arası uyumluluk için çok önemlidir.
💡
Klavye kısayolu uygulaması için bu aracı nasıl kullanırım?
Dinlemeyi başlatın, ardından istediğiniz tuş kombinasyonunu (ör. Ctrl+C, Alt+Shift+T) basın. Araç, değiştirici tuşlar (Ctrl, Alt, Shift, Meta) dahil olmak üzere tüm olay bilgilerini gösterir. Uygulamanızda belirli tuş kombinasyonlarını kontrol eden olay dinleyicilerini uygulamak için bu verileri kullanın.
📚
Fonksiyon tuşları, ok tuşları ve medya tuşları gibi özel tuşları test edebilir miyim?
Evet, araç fonksiyon tuşları (F1-F12), ok tuşları, değiştirici tuşlar, özel tuşlar (Escape, Tab, Enter) ve medya tuşları dahil olmak üzere tüm klavye tuşlarını algılar. Tuş adı, kod, konum ve değiştirici durumlar dahil olmak üzere tam bilgilerini görmek için herhangi bir tuşa basın.
💡Nasıl Kullanılır
🧭
Dinlemeyi Başlatın
"Dinlemeyi Başlat" düğmesine tıklayarak klavye olaylarını yakalamaya başlayın.
⌨️
Tuş Kombinasyonlarını Deneyin
Tek tuşlar ve Shift, Ctrl, Alt, Meta gibi kombinasyonları test ederek modifier durumlarını gözlemleyin.
🔍
Verileri İnceleyin
Key, keyCode, code, location ve repeat değerlerini; ayrıca olay zaman damgasını kontrol edin.
🗂️
Bilgileri Kopyalayın
İlgili alanların yanındaki kopyalama düğmesiyle değerleri panoya alın ve dokümantasyona ekleyin.
🔗Related Documents
⌨️MDN - KeyboardEvent API-KeyboardEvent arayüzü, key/code değerleri ve modifier tuşları hakkında kapsamlı referans.
📖W3C - UI Events Specification-Klavye ve kullanıcı arayüzü olaylarını tanımlayan resmi W3C spesifikasyonu.
🔢MDN - KeyboardEvent.code-Klavye düzeninden bağımsız fiziksel tuşu temsil eden `code` özelliği referansı.
⚙️W3C - Keyboard Event Code Values-Farklı klavye düzenlerinde kullanılan standart `code` değerlerinin tam listesi.
📋MDN - Keyboard Event Handling Guide-Web uygulamalarında klavye olaylarını ele alırken izlenecek en iyi uygulamalar.
📦Önerilen Bileşenler
User Comments
Loading...