Birkaç Android uygulamasında ve ICS'de gördüğünüz gibi bir yardım katmanı nasıl oluşturabilirim?


93

ICS ilk kez yüklendiğinde veya ES File Explorer veya Apex Launcher gibi uygulamalarda gördüğünüz gibi yardım katmanları oluşturmak istiyorum (daha fazlası var, ancak şu anda bunları düşünemiyorum). Bu sadece bir görünümün diğerinin üzerinde oturduğu göreceli bir düzen mi? Böyle bir şeyi yapmak için herhangi bir örnek kod bulamadım. Bunun nasıl yapıldığını bilen veya herhangi bir fikri olan var mı?

ES Dosya Gezgini ES Dosya Gezgini

Yanıtlar:


84

Normalde arayacağınızı varsayalım setContentView(R.layout.main), ancak ilk çalıştırmada bu katmana sahip olmak istersiniz.

Adım # 1: FrameLayoutJava kodu oluşturun ve bunu iletin setContentView().

Adım # 2: LayoutInflaterşişirmek için R.layout.mainiçine FrameLayout.

Adım # 3: LayoutInflaterYer paylaşımını FrameLayout.

Adım # 4: Kullanıcı kaplamayı kapatmak için düğmeye (veya her neyse) dokunduğunda removeView(), kaplamayı FrameLayout.

Bindirme, öğesinin sonraki bir alt FrameLayoutöğesi olduğu için içeriğinin üzerinde yüzer R.layout.main.


6
@ ssuperz28: Evet, elle çizilmiş ok uçları ve balon hariç. Bunlar için tek başınasın. :-)
CommonsWare

İstediğini yapmayı başardın mı bilmiyorum ama işte başka bir alternatif. stackoverflow.com/questions/8841240/… CommonsWare tarafından verilen çözümü uygularsanız, okları ayarlamak için karşılaştığım tek şey, yönergelerin FrameLayout'unu bir resourceImage veya backgroundImage ile zaten oklarla görüntü ile tanımlamaktır. (ve şeffaflık).
Edison Santos

1
Bunu yapmanın bir yolu var ama bunu Çerçeve Düzeni'nden aşağıda olan çocukların konumuna göre mi yapıyor?
4gus71n

@CommonsWare - efendim, bu hangi cihaz olursa olsun işe yarar mı?
Rat-a-tat-a-tat Ratatouille

2
@ user3364963: Nesnelerin konumlarını dinamik olarak ayarlayın. Cevabım biraz basitleştirildi. Vurgulanacak öğelerin konumunu belirlediklerini ve "kılavuz işaretlerinin" koordinatlarını ayarladıklarını varsayıyorum. ViewGroup"Köprü işaretleri" katmanı için bir gelenek bunu halledebilir ve ShowcaseViewbu modelin hazır uygulamalarını sunan kitaplıklar (örneğin ) vardır.
CommonsWare

80

"Koç işareti", UX konuşmasındaki "Yardım yerleşimi" dir :-)

coach_mark.xml , koç işareti düzeninizdir

coach_mark_master_view , coach_mark.xml'deki en üstteki görünümün (kök) kimliğidir

public void onCoachMark(){

    final Dialog dialog = new Dialog(this);
    dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
    dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
    dialog.setContentView(R.layout.coach_mark);
    dialog.setCanceledOnTouchOutside(true);
    //for dismissing anywhere you touch
    View masterView = dialog.findViewById(R.id.coach_mark_master_view);
    masterView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            dialog.dismiss();
        }
    });
    dialog.show();
}

Coach_mark.xml örneğinin eklenmesi (Oded Breiner tarafından verilen bu mükemmel çözüme), böylece ppl'nin çalışan örneği hızlıca görmek için kopyalayıp yapıştırması kolaydır.

Burada coach_mark.xml örneği, -> drawable / coach_marks resminize değiştirin:

coach_mark.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/coach_mark_master_view">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
         <ImageView
             android:id="@+id/coach_marks_image"
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             android:layout_centerInParent="true"
             android:layout_gravity="center_horizontal"
             android:src="@drawable/coach_marks" />
    </RelativeLayout>
</LinearLayout>

Ve isteğe bağlı olarak dolguyu kaldırmak için bu temayı kullanın:

<style name="WalkthroughTheme" parent="Theme.AppCompat">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>

Merhaba, bu Diyaloğu ekrana uyacak şekilde nasıl uzatabilirsiniz? Belgelerden A dialog is a small window that prompts [...]. A dialog does not fill the screen and is normally used for modal events [...].,. Bu kodu kullanırsam, ana görünümümü ekranın küçük bir bölümünde sıkıştırılmış hale getiririm. Ayarladıysam android:layout_width="640dp" android:layout_height="480dp"(yani, test ettiğim ekranın gerçek değerlerini), doğru çalışıyor. (tabii ki bu uygulanabilir bir çözüm değil)
ocramot

@ocramot: Yukarıdaki örnek match_parent ve Window nedeniyle tam ekran olmalıdır.FEATURE_NO_TITLE
Oded Breiner

O zaman başka bir sorun olmalı, çünkü bunu farklı bir şekilde görüyorum
ocramot

1
Bunun en az birkaç aylık olduğunu biliyorum ama bu tam ekran sorusu hiç çözüldü mü?
cbhedd

3
Diyaloğun temasını nasıl ayarlayacağını bilmeyenler için, diyaloğu şu şekilde somutlaştırın:new Dialog(getContext(), R.style.WalkthroughTheme);
w3bshark

4

Bunu oldukça hızlı yapabilirsiniz. Örneğin, yardım bilgilerinize karşılık gelen alfa ile bir resim koyduğunuz ve bir kaplama gibi ne çizmek istediğinizi bir LinearLayout eklersiniz. Aktivitenizin xml'sinde, bu düzeni, Gone görünürlüğü ile aktivitenizin düzeninden sonra bir RelativeLayout'a koyarsınız. Yardım bilgisini çizmek istediğinizde, bu görünürlüğü görünür olarak ayarlamanız gerekiyordu.

Umarım, herhangi bir sorunuz varsa, cevap verebilirim.


Giriş için teşekkürler. Ben bunun nasıl yapıldığını hayal ettim. Aşağıdaki cevaba itibar etmeliyim, çünkü ben onu bu şekilde inşa edeceğim. Daha yönetilebilir görünüyor ve ana etkinlik düzenimi değiştirmem gerekmiyor.
ssuperz28

1

Geçerli etkinliğin üzerine bir kaplama düzenini programlı olarak nasıl gösterdiğimi başka bir yanıtla görün. Activity'nin layout.xml dosyasının kaplama dış görünümü hakkında hiçbir şey bilmesi gerekmez. Bindirmeyi yarı saydam koyabilir, ekranın yalnızca bir bölümünü kapatabilir, bir veya daha fazla metin görünümü ve üzerine düğme koyabilirsiniz ... Programlı olarak bir düğme nasıl bindirilir?

  • res / layout / paused.xml RelativeLayout şablonu oluşturun veya herhangi bir düzen üst düzeyini kullanın
  • bindirme kaplamasını göstermek için bir işlev oluşturun
  • anahtar layout.xml için tutamaç elde etmektir, nesneyi görüntülemek için xml'yi ayrıştırmak için LayoutInflater sınıfını kullanın, geçerli yerleşim yapısına kaplama görünümü ekleyin
  • Örneğim, kaplama nesnesini görünüm yapısından tamamen kaldırarak yok etmek için bir zamanlayıcı kullanıyor. Bu muhtemelen ondan iz bırakmadan kurtulmak için de istediğiniz şeydir.

Amacım, ana faaliyetlerin herhangi bir kaplama dış görünümünün farkında olmaması, kaplamaların gelip gitmesi, birçok farklı kaplama olması, overlay1.xml metin dosyalarını şablon olarak kullanmaya devam edebilmesi ve içeriğin programlı olarak güncellenmesi gerektiğiydi. CommonsWare'in bize anlattığım şeyi yapıyorum, gönderimin başlamak için gerçek program kodunu gösteriyor.

feragatname: OPs "Girişiniz için teşekkürler. Bunun nasıl yapıldığını hayal ettim. Aşağıdaki cevaba itibar etmeliyim" yorumu benim cevabım değil, CommonsWare cevabı anlamına geliyor. Stackoverflow, sipariş sonrası siparişleri değiştirdi.

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.