Kart Kaydırma Aracı

Glass ile kartlarınızla zengin etkileşimler (ör. kaydırma veya kaydırma) oluşturabilirsiniz. ve animasyonlar.

Etkinliklerdeki kaydırma kartları

Glass ekran ve dokunmatik alan, kaydırılabilir kartlar görüntülemek için idealdir. örneğin Glass zaman çizelgesindeki gibi. Bir etkinlik oluşturuyorsanız ile aynı türde bir efekt CardScrollView widget'ını tıklayın.

1. Uygulama CardScrollAdapter müşterinize kart sağlamak için CardScrollView. Standart bir görünüm hiyerarşisini kendiniz oluşturabilir veya CardBuilder sınıfını kullanır.
2. Bir metin oluştur: CardScrollView CardScrollAdapter kart tedarikçisi olarak düşünebilirsiniz.
3. Etkinliğinizin içerik görünümünü CardScrollView veya CardScrollView görebilirsiniz.

Aşağıda, üç kart arasında geçiş yapan basit bir uygulama verilmiştir:

public class CardScrollActivity extends Activity {

    private List<CardBuilder> mCards;
    private CardScrollView mCardScrollView;
    private ExampleCardScrollAdapter mAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        createCards();

        mCardScrollView = new CardScrollView(this);
        mAdapter = new ExampleCardScrollAdapter();
        mCardScrollView.setAdapter(mAdapter);
        mCardScrollView.activate();
        setContentView(mCardScrollView);
    }

    private void createCards() {
        mCards = new ArrayList<CardBuilder>();

        mCards.add(new CardBuilder(this, CardBuilder.Layout.TEXT)
                .setText("This card has a footer.")
                .setFootnote("I'm the footer!"));

        mCards.add(new CardBuilder(this, CardBuilder.Layout.CAPTION)
                .setText("This card has a puppy background image.")
                .setFootnote("How can you resist?")
                .addImage(R.drawable.puppy_bg));

        mCards.add(new CardBuilder(this, CardBuilder.Layout.COLUMNS)
                .setText("This card has a mosaic of puppies.")
                .setFootnote("Aren't they precious?")
                .addImage(R.drawable.puppy_small_1);
                .addImage(R.drawable.puppy_small_2);
                .addImage(R.drawable.puppy_small_3));
    }

    private class ExampleCardScrollAdapter extends CardScrollAdapter {

        @Override
        public int getPosition(Object item) {
            return mCards.indexOf(item);
        }

        @Override
        public int getCount() {
            return mCards.size();
        }

        @Override
        public Object getItem(int position) {
            return mCards.get(position);
        }

        @Override
        public int getViewTypeCount() {
            return CardBuilder.getViewTypeCount();
        }

        @Override
        public int getItemViewType(int position){
            return mCards.get(position).getItemViewType();
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            return mCards.get(position).getView(convertView, parent);
        }
    }
}

Kaydırma kartlarıyla etkileşimde bulunma

Başlangıç CardScrollView AdapterView tarihinde uzatılır standart Android işleyicileri uygulayabilirsiniz.

1. Devralınan öğeyi çağırma CardScrollView cihazınızda setOnItemClickListener().
2. Bir onItemClick() işleyicisi olabilir.

Önceki örneğin, dokunma sesi çalan bir uzantıyı burada görebilirsiniz Bunu yapmak için:

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        ...
        setupClickListener();
        setContentView(mCardScrollView);
    }

    private void setupClickListener() {
        mCardScrollView.setOnItemClickListener(new AdapterView.OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
                am.playSoundEffect(Sounds.TAP);
            }
        });
    }

Kaydırma kartlarına animasyon ekleme

Kaydırma kartları için kullanılabilecek üç animasyon vardır: Gezinme, Ekleme ve Silme.

1. Kart grubunda belirtilen bir konuma karta ekleme veya silme işlemi uygulayın.
2. Telefonla arama animate() ve CardScrollView.Animation sıralamasından bir değer kullanın.

3. Daha düzgün bir animasyon görüntülemek için tüm referansları kaldırın: notifyDataSetChanged(). animate() yöntemi, veri kümesi görünümünüzün güncellenmesini gerçekleştirir.

   private class ExampleCardScrollAdapter extends CardScrollAdapter {
       ...
   
       // Inserts a card into the adapter, without notifying.
       public void insertCardWithoutNotification(int position, CardBuilder card) {
           mCards.add(position, card);
       }
   }
   
   private void insertNewCard(int position, CardBuilder card) {
       // Insert new card in the adapter, but don't call
       // notifyDataSetChanged() yet. Instead, request proper animation
       // to inserted card from card scroller, which will notify the
       // adapter at the right time during the animation.
       mAdapter.insertCardWithoutNotification(position, card);
       mCardScrollView.animate(position, CardScrollView.Animation.INSERTION);
   }
   

Kaydırma kartları için performans ve uygulama ipuçları

Hesap oluştururken tasarım ve performansla ilgili olarak aşağıdaki noktaları göz önünde bulundurun: kart kaydırıcıları.

Kartın yaşam döngüsü

Performansı artırmak için CardScrollView bir veri feed'i kullanan kartların yalnızca bir CardScrollAdapter sağlar (genellikle kullanıcıya görünenler ve birkaç tane daha). Bu nedenle, kartlar aşağıdaki dört genel durumdan herhangi birinde olabilir:

• Ayrıldı: Kart kaydırma görünümünde şu anda bu kart gerekli değildir. Kartın onDetachedToWindow() tarafından bilgilendirilirsiniz. yöntemini çağırın.
• Eklendi: Kart kaydırma görünümü, getView(), çünkü kart "etkinleştirilmeye" yakın. Böyle bir durumda, kartın onAttachedToWindow() yöntemi üzerinden bilgilendirilirsiniz.
• Etkinleştirildi: Kart kullanıcı tarafından kısmen görülebilir, ancak kart kaydırılır görünüm "seçilmedi" kullanıcıya gösterilecek kartı içerir. İlgili içeriği oluşturmak için kullanılan 'isActived()' yöntemi bu durumda true değerini döndürür.
• Seçili: Kart, kullanıcının ekranın tamamını kaplar. getSelectedView() çağrıldığında, seçili olan kart döndürülür. isSelected() yöntemi şu sonucu döndürür: doğru değerini alır.

Kartınızın görünümünü canlandırıyor veya yüksek maliyetli başka işlemler gerçekleştiriyorsanız, Şuradaki işlemleri başlatıp durduracak: onAttachedToWindow() ve onDetachedToWindow() tasarruf edin.

Kart geri dönüşümü

Bir kart çıkarılma durumundan çıkarıldığında Kart, takılı olan bir kart tarafından geri dönüştürülebilir ve kullanılabilir. Görünümleri güncel bilgilerle geri dönüştürmek, Arkadaş Bitkiler projesinin yeni görünümler oluşturulması.

Kartların geri dönüşümünden yararlanmak için getItemViewType() getViewTypeCount(), ve getView() yöntem olan CardScrollAdapter sınıfını kullanır. Ardından, CardBuilder sayfasındaki kolaylık yöntemlerinden bazılarını kullanırsınız. CardScrollAdapter geri dönüşüm eğitimi verecek, aşağıdaki örnekte olduğu gibi:

private List<CardBuilder> mCards;
...
/**
 * Returns the number of view types for the CardBuilder class. The
 * CardBuilder class has a convenience method that returns this value for
 * you.
 */
@Override
public int getViewTypeCount() {
    return CardBuilder.getViewTypeCount();
}

/**
 * Returns the view type of this card, so the system can figure out
 * if it can be recycled. The CardBuilder.getItemViewType() method
 * returns it's own type.
 */
@Override
public int getItemViewType(int position){
    return mCards.get(position).getItemViewType();
}

/**
 * When requesting a card from the adapter, recycle the view if possible.
 * The CardBuilder.getView() method automatically recycles the convertView
 * it receives, if possible, or creates a new view if convertView is null or
 * of the wrong type.
 */
@Override
public View getView(int position, View convertView, ViewGroup parent) {
    return  mCards.get(position).getView(convertView, parent);
}

Kararlı kart kimlikleri uygulama

Bir kart seçilip kullanıcılara gösterildiğinde temel bağdaştırıcıda yapılan değişikliklerin, kullanıcıların gördüğü kartı etkilemesini istiyorsanız gerekir. Örneğin, kullanıcı seçili bir kartı görüntülüyorsa ve kullanıcının kartı söz konusu kartın sol tarafından kaldırılır. sola kayabilir, çünkü reklamverenlerin CardScrollAdapter varsayılan olarak, değişiklik yapıldığında kimlikleri temel veri kümesine yeniden atar.

Kartlarınıza benzersiz kimlikler atamak mantıksal olarak mantıklıysa Söz konusu sorunu önlemek için temel veri kümesinde tutarlı bir kimlik. Bunu yapmak için, hasStableIds() ve true döndürün. Bu, sisteme CardScrollAdapter Veri kümesi değişikliklerinde sabit kimlikler korur. Ek olarak, getItemId() kullanın. Varsayılan uygulama, kartın adaptördeki konum dizinini döndürür. yapısı gereği istikrarsızdır.

Card ScrollAdapter boş

Bağdaştırıcılar için boş bir veri kümeniz olduğunda varsayılan görünüm siyah ekran. Bu gibi durumlarda farklı bir görünüm göstermek isterseniz setEmptyView() kullanmayın. Bunun yerine CardScrollAdapter hesabınızda tek bir kart oluşturun.

Yatay çekme geri bildirimi

Glass üzerindeki yerleşik sürüklenmelerin çoğunda "çekme" özelliği bulunur. geri kaydırırken geri bildirime işlem yapmaz. Örneğin, bu geri bildirimi Fotoğraf çektikten sonra kaydırma.

Yoğunlaşma sürecinde yatay kaydırma hareketleri kullanılmıyorsa uygulamaya özgü işlevler için, bu çekme efektini düzenin içindeki CardScrollView bir kart bulun.

1. Aşağıdaki yardımcı sınıfı projenize kopyalayın:

   public class TuggableView extends CardScrollView {
   
       private final View mContentView;
   
       /**
        * Initializes a TuggableView that uses the specified layout
        * resource for its user interface.
        */
       public TuggableView(Context context, int layoutResId) {
           this(context, LayoutInflater.from(context)
                   .inflate(layoutResId, null));
       }
   
       /**
        * Initializes a TuggableView that uses the specified view
        * for its user interface.
        */
       public TuggableView(Context context, View view) {
           super(context);
   
           mContentView = view;
           setAdapter(new SingleCardAdapter());
           activate();
       }
   
       /**
        * Overridden to return false so that all motion events still
        * bubble up to the activity's onGenericMotionEvent() method after
        * they are handled by the card scroller. This allows the activity
        * to handle TAP gestures using a GestureDetector instead of the
        * card scroller's OnItemClickedListener.
        */
       @Override
       protected boolean dispatchGenericFocusedEvent(MotionEvent event) {
           super.dispatchGenericFocusedEvent(event);
           return false;
       }
   
       /** Holds the single "card" inside the card scroll view. */
       private class SingleCardAdapter extends CardScrollAdapter {
   
           @Override
           public int getPosition(Object item) {
               return 0;
           }
   
           @Override
           public int getCount() {
               return 1;
           }
   
           @Override
           public Object getItem(int position) {
               return mContentView;
           }
   
           @Override
           public View getView(int position, View recycleView,
                   ViewGroup parent) {
               return mContentView;
           }
       }
   }
   

2. Etkinliğinizdeki onCreate yöntemini değiştirerek CardScrollView düzeninizi içerir.

   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
   
       // was: setContentView(R.layout.main_activity);
       setContentView(new TuggableView(this, R.layout.main_activity));
   }