Estou tentando criar um Carousel no Android como o deste video (código fonte) mas não está dando muito certo.
-
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.– vianaCommented 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– carlos giovani casiloCommented 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.– vianaCommented 22/08/2016 às 20:15
-
Melhor dizendo, eu preciso de ajuda para fazer. Os exemplos q eu achei estão muito confusos, é isso.– carlos giovani casiloCommented 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.– vianaCommented 22/08/2016 às 20:29
|
Mostrar mais 2 comentários
1 Resposta
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.+'
}
-
1Muito Obrigado pela ajuda. Vou testar agora. Valeu mesmo. Commented 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? Commented 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. =)– vianaCommented 24/08/2016 às 19:37