3

Estou tentando criar um Carousel no Android como o deste video (código fonte) mas não está dando muito certo.

7
  • 2
    É melhor você detalhar mais seu problema aqui pois talvez ninguém vá tirar um tempo para assistir seu vídeo. Melhore suas perguntas para ter mais sucesso nas suas respostas.
    – viana
    22/08/2016 às 18:39
  • Desculpe, o meu problema e o seguinte, preciso criar um carousel para exibir cards como se fosse imagens tipo um slide show 22/08/2016 às 20:10
  • Então cara, se você não dizer o que está dando errado, ninguém vai poder te ajudar. Você não pode simplesmente falar que está errado sem mostra o erro.
    – viana
    22/08/2016 às 20:15
  • Melhor dizendo, eu preciso de ajuda para fazer. Os exemplos q eu achei estão muito confusos, é isso. 22/08/2016 às 20:26
  • Você quer que alguém faça para você ou quer ajuda para resolver o que você tentou fazer? Teria como você pelo menos postar alguma foto, código, ou algo parecido. Eu estou no meu job, nem posso abrir seu vídeo.
    – viana
    22/08/2016 às 20:29

1 Resposta 1

2

Vamos lá! Primeiramente você precisa criar um elemento ViewPager dentro de sua xml desta forma res/layout/activity_main.xml:

XML

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:id="@+id/relativeLayout">


    <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v4.view.ViewPager>

</RelativeLayout>

Para customizar seu adapter, você precisa criar res/layout/pager_item.xml:

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageView" />

</LinearLayout>

Adapter

Depois disso, você pode criar o adapter customizado para definir o seu ViewPager:

public class CustomPagerAdapter extends PagerAdapter {

    private Context mContext;
    private LayoutInflater mLayoutInflater;
    private int[] mResources;

    public CustomPagerAdapter(Context context, int[] resources) {
        mContext = context;
        mResources = resources;
        mLayoutInflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    }

    @Override
    public int getCount() {
        return mResources.length;
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == ((LinearLayout) object);
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        View itemView = mLayoutInflater.inflate(R.layout.pager_item, container, false);

        ImageView imageView = (ImageView) itemView.findViewById(R.id.imageView);
        imageView.setImageResource(mResources[position]);

        container.addView(itemView);

        return itemView;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((LinearLayout) object);
    }

}

Activity

Em seguida, coloque o seguinte código no onCreate na sua Activity:

mViewPager = (ViewPager) findViewById(R.id.pager);

// Aqui estao suas imagens dentro do drawable
int[] mResources = {
    R.drawable.first,
    R.drawable.second,
    R.drawable.third,
    R.drawable.fourth,
    R.drawable.fifth,
    R.drawable.sixth
};

CustomPagerAdapter mCustomPagerAdapter = new CustomPagerAdapter(this, mResources);

mViewPager.setAdapter(mCustomPagerAdapter);

Veja este tutorial para mais detalhes.

CardView

Para você fazer uma adaptação usando cardview, você precisa alterar seu res/layout/pager_item.xml:

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <!-- A CardView that contains a TextView -->
    <android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/card_view"
    android:layout_gravity="center"
    android:layout_width="200dp"
    android:layout_height="200dp"
    card_view:cardCornerRadius="4dp">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/imageView" />

    </android.support.v7.widget.CardView>

</LinearLayout>

O widget CardView é parte da Biblioteca de Suporte v7. Para usar esse widget no projeto, adicione esta dependência do Gradle ao módulo do aplicativo:

dependencies {
    ...
    compile 'com.android.support:cardview-v7:21.0.+'
}
3
  • 1
    Muito Obrigado pela ajuda. Vou testar agora. Valeu mesmo. 24/08/2016 às 18:07
  • Funcionou perfeitamente, mais uma vez obrigado. Agora, me surgiu uma duvida, nesse exemplo esta sendo utilizado 6 imagens, ao chegar na ultima teria como fazer com que ele continue voltando para a primeira? 24/08/2016 às 19:14
  • @carlosgiovanicasilo você poderia marcar essa questão como válida e fazer outra pergunta no Stackoverflow. É melhor que melhora sua pontuação, minha pontuação, e outras pessoas podem também te ajudar na resposta. =)
    – viana
    24/08/2016 às 19:37

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .