Hevesli Google Glass Geliştiricileri İçin Bir Eğitim: İlk Glass Uygulamanızı Oluşturma

Google Glass, dünya ile etkileşim kurmak için cihazlarımızı kullanma şeklimizde devrim yaratmayı vaat eden fütüristik bir teknolojidir. Ancak bir geliştiricinin bakış açısından, cam için geliştirme konusunda bu kadar özel olan nedir? Cevap "Hiçbir şey!" Aslında, deneyimli bir Android geliştiricisinin bakış açısından Google Glass, çok küçük bir ekrana ve sınırlı özelliklere sahip başka bir Android cihazıdır!

Android geliştirme bilgisine sahip herkesin fütürist giyilebilir teknoloji müjdecilerinden oluşan bu "elit" topluluğun bir üyesi olabilmesi, Google Glass'ı bu kadar harika yapan şeyin bir parçasıdır. Elbette, "Immersion" ve "Active Card" arasındaki fark gibi birkaç yeni şey öğrenmeniz gerekecek, ancak göreceğiniz gibi, öğrenme eğrisi dik değil.

Bu Google Glass eğitiminin amacı, tüm ortak adımları kapsayan basit bir uygulama oluşturarak herhangi bir Glass uygulaması geliştirmek için zemin hazırlamaktır. Amacım araştırma ve deneme yanılma ile size biraz zaman kazandırmak ve en kısa sürede ilk Glass uygulamanızı çalıştırmanızı sağlamak.

Bu eğitimde ilk olarak geliştirme ortamınızı nasıl kuracağınızı ve Google Glass'ınızı bilgisayarınıza nasıl bağlayacağınızı gözden geçireceğiz. Ardından, özel sesli komutlar ve Glass başlat menüsü ile entegrasyon içeren basit bir “Merhaba Dünya” Glass uygulaması oluşturacağız. Glass'ınızda ilk uygulamanızı geliştirip çalıştırdığınızda, Glass uygulamalarında gezinmenin, sesle etkinleştirilen menülerin ve dinamik içerik oluşturmanın temellerini öğreneceksiniz.

Gemiye Nasıl Binilir

Glass, hâlâ Google'ın "Explorer Programı" terimini icat ettiği bir tür "beta testi" aşamasındadır. Adını nasıl koyarsanız koyun, Glass henüz bir akıllı telefon gibi mağazadan alabileceğiniz bir şey değil. Ne yazık ki, Android geliştirme araçları, uygulamanızı gerçek donanım olmadan geliştirmek için kullanabileceğiniz bir öykünücüye sahip değil.

Bu nedenle, uygulamanızı çalıştırmak ve hata ayıklamak için Explorer Programı aracılığıyla gerçek bir Google Glass'a sahip olmanız gerekir. Programa katılmak için kayıt sayfasını ziyaret edin ve erişim için kaydolun. Onaylandıktan sonra kredi kartınızı hazırlayın ve bardağınızın teslim edilmesini bekleyin. Glass'ın Explorer sürümü şu anda 1.500 USD'ye mal oluyor, ancak cihaz mağazalara ulaşmadan önce fiyatın önemli ölçüde düşmesi bekleniyor.

Camsızlar İçin

Herhangi bir öykünücünün olmaması nedeniyle, bu eğitimde (veya herhangi bir Glass uygulamasında) uygulamayı geliştirmek için gerçek Google Glass donanımına sahip olmanız gerekir, ancak bir tane edinmek bütçenizin dışındaysa, cesaretiniz kırılmasın - bu yine de takip etmekte fayda var. Eğitimde açıkça görülecek olan şey, Glass için geliştirmenin diğer herhangi bir Android platformu için geliştirme ile neredeyse aynı olduğudur!

Google Glass'ı hâlâ kullanmadıysanız, ancak bu konuda benim kadar heyecanlıysanız, kullanıcı arayüzünün temellerini anlamanız için size yeterli girdi sağlamaları gerektiği için bu iki videoya bir göz atın.

• Google Glass'a Giriş
• Google Glass Nasıl Yapılır: Başlarken

Kurulum ve gezinme için daha da faydalı videolar burada ve burada kullanıcı arayüzü hakkında daha birçok ayrıntı var.

Angajman kuralları

Bu Google Glass geliştiricisinin öğreticisi aşağıdaki varsayımları yapar:

• Navigasyonun ve Glass'ın kurulumunun temellerini anladığınızı varsayıyorum. Glass'ı hiç kullanmadıysanız, yukarıda bağlantısı verilen videolara bir göz atın.
• Android geliştirmenin temellerini anladığınızı varsayıyorum: proje dosyalarının yapısı, Android uygulamalarının konfigürasyonu vb.
• Android Studio'yu kullanacağım, ancak talimatlar hemen hemen tüm Android geliştirme ortamlarına çevrilmelidir. Android Studio hala "beta" aşamasında, ancak Glass da öyle. Kullanmaya başlamaktan korkmayın - gerçekten harika bir ürün. Android Studio buradan indirilebilir.

Google Glass'ınızı Ayarlama

Pekala, başlayalım!

Yapmanız gereken ilk şey, Glass'ınızda hata ayıklama modunu etkinleştirmektir. Uygulamalarınızı geliştirmek için kullandığınız her Android cihazında böyle bir şey yapmanız gerekir, böylece tanıdık gelebilir. Hata ayıklamayı etkinleştirmek için “ Ayarlar ” -> “ Cihaz bilgisi ” seçeneğine kaydırın ve ardından cihaz menüsünü açmak için öğesine dokunun. “ Hata ayıklamayı aç ”ı seçin ve etkinleştirilecektir.

Ardından, geliştirme ortamınızı hazırlamanız gerekir. Google Glass'ın mevcut sürümü, API sürüm 19'u kullanmanızı gerektirir, bu nedenle kurulu olduğundan emin olun. Ayrıca Glass Development Kit'inizin kurulu olması gerekir. Henüz yapmadıysanız, bu iki paketi yüklemek için Android SDK Yöneticinizi kullanın.

Selam Dünya!

O halde ilk “Züccaciye” parçamızı yapalım. (Evet, Google başka bir terim icat etti! "Glassware", Google Glass'da çalışan herhangi bir uygulamanın adıdır). Eski güzel bir “Merhaba Dünya!” geliştirerek başlayacağız. başvuru. Çoğu büyük Android geliştirme ortamı gibi, Android Studio da bu ünlü ifadeyi görüntülemek için yeni uygulamaları otomatik olarak bir şablonla doldurur. Sonuç olarak, “Merhaba Dünya!” çalıştırma ve çalıştırma, yalnızca temel uygulama dağıtımında bir alıştırmadır.

Android Studio'da “ New Project ”e tıklayın ve proje formunu doldurun. Buna benzer bir şey kullanabilirsiniz:

Form faktörlerini ve API'yi seçerken “ Glass ” ve API 19'u seçtiğinizden emin olun.

Başlangıç ​​aktiviteniz olarak “ Daldırma Aktivitesi ”ni seçin.

Immersion ve Live Card arasındaki farkı öğrenmeniz gerekeceğini söylediğimi hatırlıyor musunuz? Google'ın Kullanıcı Arayüzü makalesi, farklı Cam ekran türlerini açıklar. İşte kısa bir özet:

• Canlı kartlar Glass zaman çizelgesine eklenir ve yüksek frekanslı güncellemeler aracılığıyla bir şey hakkında gerçek zamanlı bilgileri görüntüler. Kullanıcılar farklı kartlarla etkileşime girdiğinde bile sürekli arka planda çalışırlar. Bu, kullanıcıların farklı türden gerçek zamanlı bilgilere sürekli erişimle çoklu görev yapmalarına olanak tanır.

• Immersion'lar , zaman çizelgesi deneyiminin dışında çalışan tamamen özelleştirilebilir ekranlardır. Bunlar, kendi kullanıcı arayüzünüzü tasarlamanıza ve kullanıcı girdisini uygun gördüğünüz şekilde işlemenize olanak tanır. Kullanacağımız şey bu!

Sihirbazın bir sonraki ekranında, “ Ad ” ve “ Başlık ” için varsayılan değerleri bırakın ve “ Bitir ” e tıklayın.

Gradle bağımlılıklarınızla ilgilenip projenizi hazırladıktan sonra, Glass plug it'inizi takmanın zamanı geldi. Şimdi bu fütüristik bir gelişme!

Tüm Android ADB sürücülerinizin yerinde olduğunu ve Glass'ınızın sisteminiz tarafından tanındığını varsayarsak, Glass'ınızı cihaz listenize almalısınız.

Cihazınızı bir bilgisayara ilk kez bağlıyorsanız, Glass'ınız onay/güven kurulmasını isteyecektir. Bağlantıya izin vermek için bardağınıza hafifçe vurun ve hazır olmalısınız.

" Çalıştır "ı tıklayın ve "USB" cihazında başlatma etkinliği olarak "MainActivity" ile "Varsayılan APK"nızı dağıtın.

Birkaç saniye sonra Glass ekranınızda şöyle bir şey görmelisiniz:

Yaşasın! Uygulamanız Glass üzerinde çalışıyor! Ve tek yapmanız gereken, uygulamayı oluşturduğunuzda birkaç varsayılan değeri doldurmak!

Farklı bir şekilde belirtmediğimiz için Glass, uygulamanızı “Demoyu göster” adı altında gösterecektir. Başlangıç ​​ekranına geri kaydırırsanız ve ardından uygulama menüsünü açmak için öğesine dokunursanız, aşağıdaki gibi listelendiğini göreceksiniz:

Biraz Lehçe

Tamam, çalıştırdınız, ancak bu gerçek bir Glass uygulamasına benzemiyor ve uygulamanın "Demoyu göster" ile başlatılmasını istemiyorsunuz.

Bu derste, gerçek hissi elde etmek için biraz ince ayar yapacağız.

Temayı Ayarlama

İlk olarak, bu çirkin başlık “Hello World Immersion” etkinlik başlık çubuğuyla küçük Glass ekranınızın hiçbirini kaplamak istemiyorsunuz ve ekranınızın siyah yazı tipiyle gri olmasını kesinlikle istemiyorsunuz. Bunu düzeltmek için Android'imizdeki temayı değiştirmemiz ve Glass OS'nin bununla ilgilenmesine izin vermemiz yeterli.

Düzenlemek için res/values/styles.xml açın. Aşağıdaki içeriğe sahip olmalıdır:

 <?xml version="1.0" encoding="utf-8"?> <resources> <style name="AppTheme" parent="android:Theme.Holo.Light"> </style> </resources>

Sadece android:Theme.Holo.Light android:Theme.DeviceDefault değiştirin. Bu, Glass varsayılan temasını kullanarak uygulama düzenini ve renkleriyle otomatik olarak ilgilenmelidir.

Menü Görünümünü Tanımlama

Tamam, bu Glass geliştirme eğitiminde yapmak istediğimiz bir sonraki şey, uygulamamızı uygun bir ada ve güzel sesle kontrollü bir başlatmaya sahip olacak şekilde ayarlamaktır. Android Manifest'inizi ( AndroidManifest.xml ) açın ve yukarıdaki <application… etiketini ekleyin:

 <uses-permission android:name="com.google.android.glass.permission.DEVELOPMENT" />

DEVELOPMENT izinlerini kullanmak istemenizin nedeni, özel ses kontrolleriyle oynayabilmenizdir. Google, onaylanmış Glass uygulamalarında hangi sesli komutlara izin verildiği konusunda oldukça katıdır ve tüm yeni komutların onaylanması gerekir. Bu eğitim öğrenme amaçlı olduğundan ve bu başvuruyu resmi Züccaciye mağazasına göndermeyeceğiniz için endişelenmenize gerek yok. DEVELOPMENT izinlerini açmanız yeterlidir ve “listelenmemiş sesli komutlara” erişebileceksiniz. Bununla ilgili daha fazla bilgi için lütfen bu GDK sayfasını okuyun.

Düzenlemek için voice_trigger.xml açın. Uygulamanızı başlatmak için sesli komutun tanımlandığı yer burasıdır. res/xml/ klasöründe bulunmalıdır. Buna benzer içerik almalısınız:

 <trigger command="SHOW_ME_A_DEMO" />

Uygulamamızı başlatmak için “Bana bir demo göster” demek yerine uygulamanın adını söyleyelim. Dosyanın içeriğini şu şekilde değiştirin:

 <trigger keyword="@string/app_name" />

Bildirim dosyanıza geri dönerseniz, android:label="@string/app_name" , önceden olduğu gibi sabit kodlanmış Hello Glass değeri yerine @string/app_name kaynak dizesini de kullanacak şekilde otomatik olarak güncellendiğini fark edebilirsiniz. . Bu ayar güncellenmediyse, değeri android:label="@string/app_name" olarak ayarladığınızdan emin olun.

Ve uygulama adınız tam olarak nedir? res/values/strings.xml app_name , uygulama_adınız şu şekilde listelenmelidir:

 <string name="app_name">Hello Glass</string>

Bu, ilk Hello Glass uygulamanız için her şeyi tamamlamalıdır. Şimdi nasıl çalıştığını görelim!

Ses menüsünü getirmek için Başlangıç ​​ekranınızdan “tamam cam” diyebilirsiniz. Uygulamanız artık sesle etkinleştirilen komutlar listesindedir.

Size rehberlik edecek bu öğreticiyle, Glass uygulamanızın başlangıç ​​ekranı şu anda böyle görünüyor.

Merhaba cam diyorsanız uygulamanız başlamalı ve standartlaştırılmış bir Cam deneyimi yaşamalısınız:

Uygulamayı etkinleştirmek için sesinizi kullanmak istemiyorsanız, Başlangıç ​​ekranınıza dokunmanız yeterlidir; uygulamanızın menüde mevcut olduğunu göreceksiniz:

Ses mi Dokunma mı? İkisini de kullan!

Uygulamanızın arayüzüne ve kullanıcılarınızın onunla etkileşimine çok dikkat etmeniz çok önemlidir. Kullanıcılarınızın, örneğin bir ders veya sunum izlerken her zaman seslerini kullanabilecek durumda olmadığını unutmayın. Alternatif olarak, elleri dolu olabilir ve dokunmayı kullanamayabilirler. Mümkün olduğunda hem dokunmatik hem de sesli menü etkileşimi sağlamanızı ve kullanıcılarınızın sesli ve dokunmatik yüzeyi paralel olarak kullanarak uygulamanızda gezinmesine izin vermenizi öneririm.

Gerçek Bir Uygulama - Toptal Finder

Artık Glass geliştirme konusunda rahat olduğunuza ve Hello Glass'ı yarattığınıza göre, yeni Glass özelliklerini çalıştıracak gerçek bir uygulama oluşturmanın zamanı geldi. Geliştirme platformuna dayalı olarak en iyi Toptal geliştiricilerinin profillerine göz atmanıza izin veren bir uygulama oluşturalım.

Örnek Glass uygulamamızın yapısı basit olacaktır:

1. Başlangıç ​​ekranımızın, bir geliştiriciye ihtiyacımız olan geliştirme platformunu seçmemize olanak tanıyan sesli ve dokunma etkinleştirilmiş menüye sahip Toptal logosuna sahip olmasını istiyoruz.
2. Bir platform seçtikten sonra, resim ve adlarıyla birlikte geliştiricilerin bir listesini almak istiyoruz. Geliştirici profilleri, kaydırılabilir bir kişisel kart listesi şeklinde sunulacaktır.
3. Bir geliştirici profilini görüntülerken, onları favorilere ekleyebilmek veya kiralama talebi gönderebilmek istiyoruz.

Temeller

Şimdi Android bilginize ek olarak neleri eklediğinizi hızlıca özetleyelim:

1. Glassware oluşturmak için geliştirme ortamınızı nasıl kurarsınız.
2. Uygulamanızı standart Glassware GUI temasını kullanacak şekilde nasıl yapılandırabilirsiniz.
3. Özel sesli komutları ve menü adlarını kullanarak uygulamanızı nasıl başlatabilirsiniz.

Bu bilgiyi kullanarak yeni uygulamanızı çalışır duruma getirin. Hello Glass uygulamasını yukarıdan güncelleyebilir veya aynı adımları izleyerek yeni bir uygulama başlatabilirsiniz. Bu uygulamaya “ Top Finder ” adını verin ve voice_trigger.xml dosyanızın şöyle görünmesini sağlayın.

 <?xml version="1.0" encoding="utf-8"?> <trigger keyword="@string/app_name" > <constraints network="true" /> </trigger>

network="true" kısıtlaması, Glass'a bu uygulamayı başlatırken, Toptal geliştirici listelerine bağlanmamız gerekecek ağ bağlantısını kontrol etmesini söyler. Bağlantı yoksa, Glass bir uyarı mesajı görüntüler.

Ana ekran

Uygulamamızın ana ekranını şöyle bir hale getirelim:

Ekranınızda “tamam cam” mesajını gördüğünüzde, uygulamanın o yerde sesli aktif menüsü olduğu anlamına gelir. Burada “ok cam” ifadesinin söylenmesi, bu konum için ses menüsünü etkinleştirir. Bu ifade Glass tarafından önceden tanımlanmıştır ve değiştiremezsiniz.

“ok cam” ı tıpkı akıllı telefon/tablet geliştirmede kullandığınız gibi bir “uygulama menüsü” olarak düşünebilirsiniz ve tamamen aynı role sahiptir. Bir Android uygulama menüsünü açmak için ekranınızdaki "Uygulama menüsü simgesine" (genellikle 3 nokta veya çizgi) "dokunacağınız" gibi, Züccaciye uygulamanızda sesle etkinleştirilen menüyü açmak için "tamam cam" demeniz gerekir.

“Tamam cam” menüsünü etkinleştirmek için API'den FEATURE_VOICE_COMMANDS talep etmeniz gerekir. Bunu yapmak için MainActivity dosyanızdaki onCreate işleyicinize aşağıdaki satırı ekleyin:

 getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS);

Bu özelliği içeren her aktivite, alt merkezde “tamam cam” metni ile oluşturulacaktır.

Yapmanız gereken bir sonraki şey, ana ekran için bir menü oluşturmaktır. res/menu klasörünüzde main.xml adında yeni bir XML menü tanımı oluşturun. İşleri basitleştirmek için sadece üç Toptal geliştirici platformunu etkinleştireceğiz, ancak değişiklikleri istediğiniz gibi yapmaktan çekinmeyin.

Aşağıdaki içeriğe sahip olmalıdır:

 <?xml version="1.0" encoding="utf-8"?> <menu xmlns:andro> <item android: android:title="Top Android developer" /> <item android: android:title="Top JavaScript developer" /> <item android: android:title="Top iOS developer" /> </menu>

Basitçe Android, JavaScript ve iOS yerine neden oldukça uzun menü başlıkları seçtiğimi merak ediyor olabilirsiniz. Peki, nedeni çok basit. Glass geliştirme ekibindeki adamlar hala ses tanımayı iyileştiriyorlar. Glass'ın onları daha kolay tanıması için menülerinizde iki veya üç kelime kullanmanız önerilir.

“Tamam cam” menüsünün standart Android uygulama menünüzden bir farkı olmadığını daha önce belirtmiştim. Bir aktiviteye menü eklemek pratik olarak aynıdır. MainActivity onCreatePanelMenu işleyicisini geçersiz kılın ve az önce oluşturduğunuz ana menüyü şişirin:

 @Override public boolean onCreatePanelMenu(int featureId, Menu menu){ if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { getMenuInflater().inflate(R.menu.main, menu); return true; } return super.onCreatePanelMenu(featureId, menu); }

Şimdi bir menü işleyici eklememiz gerekiyor. Bunu yapmadan önce findDevelopers adında boş bir yöntem oluşturun. Bir arama başlatmak ve sonuçları göstermek için buna daha sonra geri döneceğiz. Bundan sonra menü işleyicinizi geçersiz kılabilirsiniz.

 public void findDevelopers(String platform){ } @Override public boolean onMenuItemSelected(int featureId, MenuItem item) { if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { switch (item.getItemId()) { case R.id.find_android: findDevelopers("Android"); break; case R.id.find_javascript: findDevelopers("Java Script"); break; case R.id.find_ios: findDevelopers("iOS"); break; } return true; } return super.onMenuItemSelected(featureId, item); }

Şimdi örnek Google Glass uygulamamızın ana ekranını güzelleştirmenin zamanı geldi. Bir Toptal logosunu res/drawable/logo.png olarak uygulamanıza aktarın. Bu resmi kullandım:

MainActivity sınıfınızda aşağıdaki değişiklikleri yapın.

Sınıfın başlangıcında aşağıdaki özel değişkenlerin bildirildiğinden emin olun:

 private CardScrollView mCardScroller; private View mView; private GestureDetector mGestureDetector;

Kart düzenini özelleştirmek için buildView yöntemini değiştirin:

 private View buildView() { Card card = new Card(this); card.setText(R.string.app_name); card.setImageLayout(Card.ImageLayout.LEFT); card.addImage(R.drawable.logo); return card.getView(); }

Ve onCreate işleyicinizi şu şekilde değiştirin:

 protected void onCreate(Bundle bundle) { super.onCreate(bundle); getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON); getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS); mView = buildView(); mCardScroller = new CardScrollView(this); mCardScroller.setAdapter(new CardScrollAdapter() { @Override public int getCount() { return 1; } @Override public Object getItem(int position) { return mView; } @Override public View getView(int position, View convertView, ViewGroup parent) { return mView; } @Override public int getPosition(Object item) { if (mView.equals(item)) { return 0; } return AdapterView.INVALID_POSITION; } }); // Handle the TAP event. mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { openOptionsMenu(); } }); mGestureDetector = createGestureDetector(this); setContentView(mCardScroller); }

Daha önce de söylediğim gibi, "ok cam" ile birlikte dokunarak etkinleştirilen menüyü dahil etmek istiyoruz, bu nedenle Android uygulamanızda yaptığınız gibi hareketleri etkinleştirin. MainActivity sınıfınıza aşağıdaki yöntemleri ekleyin:

 private GestureDetector createGestureDetector(Context context) { GestureDetector gestureDetector = new GestureDetector(context); //Create a base listener for generic gestures gestureDetector.setBaseListener( new GestureDetector.BaseListener() { @Override public boolean onGesture(Gesture gesture) { if (gesture == Gesture.TAP) { openOptionsMenu(); return true; } else if (gesture == Gesture.TWO_TAP) { // do something on two finger tap return true; } else if (gesture == Gesture.SWIPE_RIGHT) { // do something on right (forward) swipe return true; } else if (gesture == Gesture.SWIPE_LEFT) { // do something on left (backwards) swipe return true; } else if (gesture == Gesture.SWIPE_DOWN){ finish(); } return false; } }); gestureDetector.setFingerListener(new GestureDetector.FingerListener() { @Override public void onFingerCountChanged(int previousCount, int currentCount) { // do something on finger count changes } }); gestureDetector.setScrollListener(new GestureDetector.ScrollListener() { @Override public boolean onScroll(float displacement, float delta, float velocity) { // do something on scrolling return true; } }); return gestureDetector; } @Override public boolean onGenericMotionEvent(MotionEvent event) { if (mGestureDetector != null) { return mGestureDetector.onMotionEvent(event); } return false; }

Bu olmalı! Artık uygulamanızı başlatabilir ve her iki menü etkinleştirme yöntemini de deneyebilirsiniz. "Tamam cam" derseniz ekranda üç menü öğesi görüntülenir ve bardağa dokunursanız kaydırılabilir bir menü açılır. Menü öğeleri arasında gezinmek için ileri ve geri kaydırabilirsiniz.

Ses menüsü şöyle görünür:

Ve işte hareket menüsü:

Bir menü öğesi seçerseniz findDevelopers yönteminiz henüz uygulanmadığından hiçbir şey olmaz.

Geliştirici Ekranları

Sol tarafta bir resim, sağda metin ve bazı altbilgi bilgileri ile varsayılan Cam Kart düzenini kullanmaya devam edeceğiz. Kartlarınızı tasarlamaya yönelik en iyi uygulamalar hakkında daha fazla bilgi için lütfen Google Glass stil kılavuzuna bakın.

Geliştirici profilimiz basit özelliklerle tanımlanır:

1. İsim
2. Resim
3. Geliştirme platformu

Öyleyse, uygulamamızda uygun sınıf yapısına sahip olduğumuzdan emin olalım. java/models klasörünüzde DeveloperModel.java adında yeni bir sınıf oluşturun. Listedeki profilleri içereceği için bu sınıfın serileştirilebilir olmasını istiyoruz.

 public class DeveloperModel implements Serializable { private String name; public String getName(){ return name; } public void setName(String name){ this.name=name; } private String platform; public String getPlatform(){ return platform; } public void setPlatform(String platform){ this.platform=platform; } private String image; public String getImage(){ return image; } public void setImage(String image){ this.image=image; } }

Kartlarımızın geliştirici profili verilerimize sıkı sıkıya bağlı olmasını istiyoruz. Varsayılan CardScrollAdapter , veri modeli açısından biraz genel olduğundan, onu genişletmemiz ve kendimizin yapmamız gerekiyor. java/adapters klasörünüzde DeveloperAdapter.java oluşturun:

 public class DeveloperAdapter extends CardScrollAdapter { private List<Card> mCards; private List<DeveloperModel> mData; public DeveloperAdapter(List<Card> cards){ this.mCards = cards; } @Override public int getCount() { return mCards.size(); } @Override public Object getItem(int i) { return mCards.get(i); } @Override public View getView(int i, View view, ViewGroup viewGroup) { return mCards.get(i).getView(); } @Override public int getPosition(Object o) { return this.mCards.indexOf(o); } }

Arama sonuçlarımızın uygulamanın ana ekranına eklenmesini istemiyoruz, bu nedenle arama yapacak ve sonuçları görüntüleyecek yeni Activity oluşturacağız. MainActivity'nizin yanında yeni bir aktivite, ResultsActivity MainActivity (muhtemelen java/com.helloglass içinde).

extends Activity emin olun.

Ardından, geliştirici profil kartlarımız için bir menü belirlememiz gerekiyor. Aşağıdaki içerikle, developer.xml adlı yeni bir menü oluşturun:

 <?xml version="1.0" encoding="utf-8"?> <menu xmlns:andro> <item android: android:title="Add to favorites" /> <item android: android:title="Hire" /> <item android: android:title="Go back" /> </menu>

ResultsActivity ve MainActivity arasında parametre geçişini etkinleştirmek için, ResultsActivity sınıfının başına aşağıdaki satırları ekleyin:

 public static final String SEARCH = "search"; private String mPlatform="Android";

Yeni etkinliğinizi bildirim dosyanıza eklediğinizden emin olun:

 <activity android:name=".ResultsActivity" android:immersive="true" android:icon="@drawable/ic_launcher" android:label="@string/title_activityresults" android:parentActivityName=".MainActivity"> <meta-data android:name="android.support.PARENT_ACTIVITY" android:value="com.eloptico.MainActivity" /> </activity>

ResultsActivity başlangıç ​​ekranını ayarlamak ve kartları yapılandırmak MainActivity yaptığımıza çok benzer. Öncelikle, başlangıçta kartlarınızın ve kaydırma çubuğunun tanımlı olup olmadığını kontrol edin:

 private CardScrollView mCardScroller; private List<Card> mCards; private GestureDetector mGestureDetector;

Uygulamak için daha sonra geri döneceğimiz geçici bir arama yöntemi oluşturun. Profil listesine yeni kartlar eklemek, bir Diziye öğe eklemek kadar basittir. Bu yöntemi findDevelopers da adlandıracağız, ancak bu, ResultsActivity ait:

 private void findDevelopers(String platform){ for (int i=1; i<=10; i++){ Card card = new Card(this); card.setText(platform+" "+Integer.toString(i)); card.setTimestamp(platform); card.setImageLayout(Card.ImageLayout.LEFT); card.addImage(R.drawable.ic_person_50); mCards.add(card); } mCardScroller.setSelection(0); }

Şimdi MainActivity geri dönün ve ResultsActivity başlatmak ve platform özelliğini geçmek için orada findDevelopers güncelleyin:

 public void findDevelopers(String platform){ Intent resultsIntent = new Intent(this, ResultsActivity.class); resultsIntent.putExtra(ResultsActivity.SEARCH, platform); startActivity(resultsIntent); }

Geliştirici menünüzü ResultsActivity . Menüyü herhangi bir profil kartında açabileceksiniz.

 @Override public boolean onCreatePanelMenu(int featureId, Menu menu){ if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { getMenuInflater().inflate(R.menu.developer, menu); return true; } return super.onCreatePanelMenu(featureId, menu); }

Daha önce olduğu gibi, Sonuçlar Etkinliği görüntülendiğinde ResultsActivity dokunmatik yüzeyi işlemek için hareketleri etkinleştirin. Bunu yapmak için onGesture(Gesture gesture) yönteminizde openOptionsMenu() çağırmanız yeterlidir:

 private GestureDetector createGestureDetector(Context context) { // … @Override public boolean onGesture(Gesture gesture) { if (gesture == Gesture.TAP) { openOptionsMenu(); return true; } else if // …

Ayrıca, geliştiriciyle ilgili eylemlere bir menü işleyici ekleyin. Şimdilik basit Tost mesajları bırakacağız.

 @Override public boolean onMenuItemSelected(int featureId, MenuItem item) { if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { switch (item.getItemId()) { case R.id.developer_fav: Toast.makeText(getApplicationContext(), "Favorite", Toast.LENGTH_LONG).show(); break; case R.id.developer_hire: Toast.makeText(getApplicationContext(), "Message", Toast.LENGTH_LONG).show(); break; case R.id.go_back: break; } return true; } return super.onMenuItemSelected(featureId, item); }

Her uygulama bazı güzel görsel öğeler, simgeler vb. kullanmalıdır. Google Glass ekibi, Glass geliştiricilerinin uygulamalarında kullanması için ücretsiz olan çok geniş bir ortak standart simgeler kümesi sağlamıştır. Kitaplıklarında standart Glass simgelerinin yanı sıra yazı tiplerinin tamamını bulabilirsiniz.

Şimdilik, sadece bir simgeye ihtiyacınız var ic_person_50.png , bu yüzden devam edin ve onu res\drawable klasörünüze indirin. Geliştiricinin resmini indirmek yerine bu simgeyi kullanacağız.

Glass uygulama geliştirme eğitimimizde şimdilik kalan son şey, MainActivity'den hangi geliştirme platformunun iletildiğini kontrol MainActivity ve ResultsActivity üzerindeki onCreate işleyicimizi geçersiz kılmaktır.

 @Override protected void onCreate(Bundle bundle) { super.onCreate(bundle); getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON); getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS); mCardScroller = new CardScrollView(this); mCards = new ArrayList<Card>(); if(getIntent().hasExtra(SEARCH)){ mPlatform = getIntent().getStringExtra(SEARCH); } findDevelopers(mPlatform); mCardScroller.setAdapter(new DeveloperAdapter(mCards)); // Handle the TAP event. mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { openOptionsMenu(); } }); mGestureDetector = createGestureDetector(this); setContentView(mCardScroller); }

onResume ve onPause yöntemlerini MainActivity aynı şekilde bırakabilirsiniz.

Uygulamanızı şimdi başlatırsanız, MainActivity seçilen menüye göre geliştirici profillerinizin nasıl oluşturulduğunu anında kontrol edebilirsiniz. Yine, “tamam cam” kullanarak veya dokunmatik yüzeye dokunarak veya sesli aktivasyonu kullanarak menünüzü görüntüleme seçeneğiniz vardır. "10. Android geliştiricisi" profili şu anda şöyle görünüyor:

Dokunma, dokunmatik menüyü getirir:

Ve “tamam cam” demek ses menüsünü getirir:

Uygulamanızın ana ekranına geri dönmek için listeden aşağı kaydırın.

İnternetten Profil Alma

İşleri toparlamak için, menüyü JavaScript, Android ve iOS için en iyi 10 Toptal geliştiricisi için gerçek bilgilerle dolduralım.

Profil resimlerini indirmeniz ve HTTP üzerinden erişilebilir hale getirmeniz veya doğrudan toptal.com'dan URL'leri kullanmanız gerekecek.

Toptal'daki en iyi geliştiricilerin adlarını almak için bir web tarayıcısı oluşturmak, bu makale için çok fazla sapma olabileceğinden, Android, JavaScript ve iOS için kullanmanız için JSON dosyaları oluşturdum.

Uygulamanızda yapmanız gereken ilk şey, Android işletim sisteminizden internete erişim talebinde bulunmaktır. Manifest dosyanıza aşağıdaki satırı ekleyin

 <uses-permission android:name="com.google.android.glass.permission.INTERNET"/>

Glass'ın doğrudan HTTP isteklerini kullanarak ana ileti dizisini engellemenize izin vermeyeceğini unutmayın. JSON indirmelerini ve tek tek görüntüleri eşzamansız bir şekilde işlemeniz gerekecek. Zaman uyumsuz bir görev kullanabilir, kendi indirme hizmetinizi veya amacınızı veya günlük işlerinizde tercih ettiğiniz her şeyi oluşturabilirsiniz.

Bu işlevi oluşturmak Google Glass'a özgü değildir, bu nedenle kod parçacıklarını atlayacağım. Devam ederseniz ve bu son işlevsellik parçasını çalıştırırsanız, profil kartlarınız şöyle görünmelidir:

Öğretici Özeti

Bu Google Glass geliştirme eğitimini izleyerek ve ilk Glassware uygulamanızı oluştururken eğlendiğinizi umuyorum. Şimdiye kadar Glass için uygulama yazmanın diğer Android platformlarından pek de farklı olmadığı fikrine alışmış olmalısınız.

Bu noktada, Google Glass sesle etkinleştirilen Ana Ekranı nasıl genişleteceğinizi, kendi sesle etkinleştirilen menülerinizi nasıl oluşturacağınızı ve ses kontrollerini dokunma hareketleriyle nasıl birleştireceğinizi öğrendiniz. Ayrıca, kartlar, düzenler ve öğeler gibi Glass UI için kavramları ve temel yapı taşlarını da anlamalısınız. Dinamik olarak kartların nasıl oluşturulacağını ve farklı etkinlikler arasında nasıl gezinileceğini gördünüz.

Daha derine inmek için Developers.google.com/glass adresindeki Google'ın geliştirici kaynaklarına gidin. Daha karmaşık uygulamalar oluşturmaya başladığınızda, bunun çok yararlı bir kaynak olduğu kanıtlanacaktır.

Glass'ın hala geliştirme aşamasında olduğunu ve tüketici pazarına girmeden önce uygulanması gereken daha pek çok iyileştirme olduğunu lütfen unutmayın. Bunu akılda tutarak, size önemli bir notum var:

Ses tanıma konusunda yapılacak çok iş var ve aktivitenizi başlatmaya veya bazı bilgileri doldurmaya çalışırken kendinizi hayali arkadaşınıza bağırırken yakalayabilirsiniz. Endişelenmeyin - Google Glass geliştirmeyi deneyen herkes aynı şeyi hissediyor, yani yalnız değilsiniz.

Teknoloji gelişecek ve cam kısa sürede perakende satışa hazır hale gelecek. Mağazalara ulaştığında büyük dalgalar yaratacağı kesin, bu yüzden umarım bu heyecan verici teknolojinin ön saflarında yer alan ilk kişilerden biri olma konusunda benim kadar heyecanlısınızdır!

Haykır : Bu makaledeki ekran görüntüleri Droid@Screen kullanılarak yapılmıştır.