web-dev-qa-db-ja.com

androidの最新のカルーセルライブラリ

画像のカルーセルアニメーションに使用できるライブラリはありますか?

私が見つけた http://www.androidviews.net/2012/10/Android-coverflow/ ; https://code.google.com/p/Android-coverflow/ ですが、このライブラリ/スニペットはextends gallay( GalleryクラスはAPIレベル16(4.1.2)で非推奨になりました。そのため、(モダンな)ライブラリはありますか?たぶんピカソと組み合わせて?

12
ternes3

これはCarouselViewGithub Link および Android Arsenal の無料リンクです。

グラドル:

compile 'com.synnapps:carouselview:0.0.7'

Maven:

<dependency>
 <groupId>com.synnapps</groupId> 
 <artifactId>carouselview</artifactId>
 <version>0.0.7</version>
 <type>pom</type>
</dependency>

用途:
レイアウトに次のコードを含めます:

<com.synnapps.carouselview.CarouselView
    Android:id="@+id/carouselView"
    Android:layout_width="match_parent"
    Android:layout_height="200dp"
    app:fillColor="#FFFFFFFF"
    app:pageColor="#00000000"
    app:radius="6dp"
    app:slideInterval="3000"
    app:strokeColor="#FF777777"
    app:strokeWidth="1dp"/>

アクティビティに次のコードを含めます:

public class SampleCarouselViewActivity extends AppCompatActivity {

CarouselView carouselView;

int[] sampleImages = {R.drawable.image_1, R.drawable.image_2, R.drawable.image_3, R.drawable.image_4, R.drawable.image_5};

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_sample_carousel_view);

    carouselView = (CarouselView) findViewById(R.id.carouselView);
    carouselView.setPageCount(sampleImages.length);

    carouselView.setImageListener(imageListener);
}

ImageListener imageListener = new ImageListener() {
    @Override
    public void setImageForPosition(int position, ImageView imageView) {
        imageView.setImageResource(sampleImages[position]);
    }
};

}

カスタムビューを追加する場合は、ViewListener。を実装します。

public class SampleCarouselViewActivity extends AppCompatActivity {

CarouselView customCarouselView;
int NUMBER_OF_PAGES = 5;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_sample_carousel_view);

    customCarouselView = (CarouselView) findViewById(R.id.customCarouselView);
    customCarouselView.setPageCount(NUMBER_OF_PAGES);
    // set ViewListener for custom view 
    customCarouselView.setViewListener(viewListener);
}

ViewListener viewListener = new ViewListener() {

    @Override
    public View setViewForPosition(int position) {
        View customView = getLayoutInflater().inflate(R.layout.view_custom, null);
        //set view attributes here

        return customView;
    }
};

詳細については、githubリンクにアクセスしてください

カルーセルの代替品をたくさん探してみました。私はついに完璧な代替品を見つけました。

InfiniteCycleViewPager

これは、カルーセルライブラリが行うこととまったく同じです。

ドローアブルではなくSDカードから画像を読み込むように変更しました。

完璧に動作します。

まだ作業していて、助けが必要な場合は、私に連絡してください。

7
Devenom

私はそれを検索するときに利用可能なそのようなライブラリを見つけていませんが、自分のアプリを作成し、ViewPagerを使用してフラグメントを表示するとき、 ViewPager.PageTransformer を実装する独自のクラスを実装しました。

あなたはライブラリを要求しましたが、私は同様の状況に遭遇しましたが、結局自分用のクラスを作成するのに十分簡単であることがわかりました。あまりにも。私のガイダンスは、Googleデベロッパードキュメントの スクリーンスライドでのViewPagerの使用 からのものです。これが私のコードです:

public class CarouselPageTransformer implements ViewPager.PageTransformer {
    @Override
    public void transformPage(View page, float position) {
        float scaleFactor = 0.5f;
        float rotationFactor = 20;

        if (position < 0) {
            page.setRotationY(rotationFactor * -position);
            float scale = 1 + scaleFactor * position;
            page.setScaleX(scale);
            page.setScaleY(scale);

        } else {
            page.setRotationY(rotationFactor * -position);
            float scale = 1 - scaleFactor * position;
            page.setScaleX(scale);
            page.setScaleY(scale);
        }
    }
}

次に、変換をホストするアクティビティが呼び出します。

viewPager.setPageTransformer(true, new CarouselPageTransformer());

このコードはViewPagerのフラグメントを表示画面の端に配置しますが、質問で指定したリンクなどのように、表示されるように簡単に配置できます。

必要な最小SDKに注意してください。 ViewPager.PageTransformのドキュメントから:

プロパティアニメーションはAndroid 3.0以降)でのみサポートされているため、以前のプラットフォームバージョンのViewPagerでPageTransformerを設定しても無視されます。

6
phantomraa
private void setImageToCaroussel(){

    imgUrls.add("https://im.idiva.com//content/2015/May/salon_ettiquette1.jpg");
    imgUrls.add("https://www.womenfitness.net/wp/wp-content/uploads/2018/04/What-to-look-for-when-choosing-a-hair-salon-1000x667.jpg");
    imgUrls.add("https://cdn.website.thryv.com/e3abe5c926184c4ca25389d43ae29913/dms3rep/multi/mobile/713b0a2.jpg");

    carouselView = (CarouselView) findViewById(R.id.carouselView);
    carouselView.setPageCount(imgUrls.size());

    carouselView.setImageListener(imageListener);

}
 ImageListener imageListener = new ImageListener() {
    @Override
    public void setImageForPosition(final int position, final ImageView imageView) {

        Glide.with(ShopActivity.this)
                .asBitmap()
                .load(imgUrls.get(position))
                .into(new CustomTarget<Bitmap>() {
                    @Override
                    public void onResourceReady(@Nullable Bitmap resource,@Nullable Transition<? super Bitmap> transition) {
                        imageView.setImageBitmap(resource);
                    }

                    @Override
                    public void onLoadCleared(@Nullable Drawable placeholder) {

                    }

                });
    }
};
1
Jaber