SlidingCard
Sliding cards with pretty gallery effects.
Download
Include the following dependency in your build.gradle file.
Gradle:
repositories {
jcenter()
}
dependencies {
compile 'com.mxn.soul:slidingcard-core:1.3.1'
}
Usage
For a working implementation of this project see the app/
folder.
1.Add the com.mxn.soul.slidingcard_core.ContainerView to your layout XML file.
activity_main.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:card="http://schemas.android.com/apk/res-auto"
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"
tools:context=".MainActivity">
<com.mxn.soul.slidingcard_core.ContainerView
android:id="@+id/contentview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
card:card_item_height = "230dp"
card:card_item_margin = "10dp"
/>
</RelativeLayout>
card_item_height need to be bigger than the height of your photo or any view you create for each item .
if you want the first view smaller than the second one to get a beautiful screen,you need to set card_item_margin
2.Create your own layout for the card
sliding_card_item.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="@+id/sliding_card_content_view"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingBottom="20dp">
<ImageView
android:id="@+id/user_imageview"
android:layout_width="fill_parent"
android:layout_height="200dp"
android:layout_margin="10dp"
android:background="#ffffff"
android:padding="5dp"
android:scaleType="fitXY"
android:contentDescription="@string/app_name"/>
<TextView
android:id="@+id/user_text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="@id/user_imageview"
android:layout_marginBottom="5dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:background="#90575E6A"
android:padding="5dp"
android:textColor="#ffffff"
android:textSize="14sp"/>
</RelativeLayout>
3.implements ContainerView.ContainerInterface and override initCard(),exChangeCard()
public class MainActivity extends ActionBarActivity implements ContainerView.ContainerInterface {
private ContainerView contentView;
private List<PhotoContent> dataList ;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
contentView = (ContainerView) findViewById(R.id.contentview);
initData() ;
}
private void initData(){
dataList = new ArrayList<>();
String[] titles = getResources().getStringArray(R.array.title) ;
String[] imgs = getResources().getStringArray(R.array.imgs) ;
for(int n = 0 ; n < titles.length;n++){
PhotoContent photoContent = new PhotoContent(String.valueOf(n),titles[n],imgs[n]) ;
dataList.add(photoContent) ;
}
contentView.initCardView(MainActivity.this,R.layout.sliding_card_item,R.id
.sliding_card_content_view);
}
@Override
public void initCard(SlidingCard card, int index) {
ImageView mImageView = (ImageView) card.findViewById(R.id.user_imageview);
TextView mTextView = (TextView) card.findViewById(R.id.user_text);
if (dataList.get(index) != null) {
mTextView.setText(dataList.get(index).getTitle());
mImageView.setImageResource(getResourceByReflect(dataList.get(index).getUrl()));
mImageView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//the first card index must be 0
Toast.makeText(MainActivity.this, dataList.get(0).getTitle(), Toast
.LENGTH_SHORT).show();
}
}
);
}
}
@Override
public void exChangeCard() {
PhotoContent item = dataList.get(0);
dataList.remove(0);
dataList.add(item);
}
// you can ues UniversalImageLoader,Fresco etc to display image ,and replace the method
public int getResourceByReflect(String imageName) {
Class drawable = R.drawable.class;
Field field ;
int r_id;
try {
field = drawable.getField(imageName);
r_id = field.getInt(field.getName());
}
catch (Exception e) {
r_id = R.drawable.img1;
Log.e("ERROR", String.valueOf(e.getMessage()));
}
return r_id;
}
}
contentView.initCardView() need to set you own layout's name ,and the root's id . example: initCardView(ContainerInterface mContainerInterface,int layoutId,int rootId).
it's easy to set new ArrayList() to store the data , but make sure the list's size is more than 3 .
if you put it in scrollable viewgroup like listview ,viewpager etc..,drag will not work normally, I provide a method to avoid scroll conflict:
public void setScrollableGroups(ViewGroup...args)
do this after contentView's Initialization:
contentView = (ContainerView) view.findViewById(R.id.contentview);
contentView.setScrollableGroups(viewPager, listview) ;
contentView.initCardView(MyFragment.this, R.layout.sliding_card_item, R.id
.sliding_card_content_view);
TODO
Optimized memory
V1.7
support SlidingCard with Fragment. Add method to solve scroll conflict.
V1.6
make it easier to use.
V1.5
????????????????????bug? ????????? public static boolean sScrolling = false ;?????????? ??????????????????????????
V1.4
?????????????????????
V1.3
?????????.????????????????????????????????????????????????????
V1.2
????????????BUG???.
V1.1
????????
?SlidingCard?dispatchDraw?????????:
PaintFlagsDrawFilter pfd = new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG|Paint
.FILTER_BITMAP_FLAG);
canvas.setDrawFilter(pfd);
???????view???????3.0???????? ?????????????2D???????????????View?????????????? ???????????????????????????????????????????????????
if(android.os.Build.VERSION.SDK_INT>=11)
{
setLayerType(LAYER_TYPE_SOFTWARE, null);
}
???????????
V1.0
???????????????
????????
1????????????????? 2?????????? 3???????????? 4??????????bug 5????????????????? 6?????
License
Copyright 2015 soul.mxn Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0 Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.