Horizo​​ntalScrollView还是Carrousel？

Question

我想创建一个HorizontalScrollView,但在其中有一些"效果",如本例或其他示例.问题是我不知道我必须使用多少物品; 我ImageView从API 获得它应该是动态的.我怎样才能产生这样的效果:如果它被选中,它会变得更大TextView以下？我在SO上找到的最接近的例子就在这里.这正是我所需要的,但我已经测试了给出的答案,但这对我不起作用......但问题中的图像正是我想要的.任何人都可以指导我这样做吗？

假设我ImageView 只用5个测试来测试它,所以ImageView动态添加它们的例子也对我有好处.

另一个例子是Snapchat APP,但不同之处在于我想在选择上添加一些效果,比如把它变大或者什么.

编辑

我想得到一个示例,如何做一个自定义Horizo​​ntalScrollView与布局(适配器)和最重要,如果它可能添加一个效果点击一个,我想要适配器,因为我需要得到该项目点击当然.我认为我应该使用RecycleView作为@UncaughtException对我说,因为我不知道我会得到多少图像,我将不得不穿上我的APP所以我认为这是解决方案.

这将是Snapchat HoritzontalScrollView和来自SO问题的这张图片的混合

Answer 1

你的情况肯定可以使用ViewPager,但如果我是你,我会去RecyclerView用LinearLayoutManager的定向设定到Horizontal,这样你就不会需要一个HorizontalScrollView,并使用RecyclerView你也会得到adapter你正在寻找的东西..

现在,为了scale或显示其他一些影响,click以区别于其他人,你可以Animate这个特定的观点,

我已经为此编写了一些演示代码,在这里发布了所需的文件,让我知道这是否是你想要的,

活动

/**
  * Created by Satyen on 10/27/15.
  **/
public class SlidingDrawerActivity extends Activity {

   RecyclerView rcyList;

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

        rcyList = (RecyclerView) findViewById(R.id.rcyList);

        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        layoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);
        rcyList.setLayoutManager(layoutManager);

       /* rcyList.addItemDecoration(
                new DividerItemDecoration(this, null));*/
        MyRecyclerViewAdapter myRecyclerAdapter = new MyRecyclerViewAdapter(this);
        rcyList.setAdapter(myRecyclerAdapter);

    }


}

活动布局

<!-- layout_scroll_list.xml -->

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:layout_weight="1">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/rcyList"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:background="@android:color/holo_blue_dark"
        android:paddingLeft="8dp"
        android:paddingRight="8dp" />

</FrameLayout>
</LinearLayout>

适配器

public class MyRecyclerViewAdapter extends RecyclerView.Adapter<MyRecyclerViewAdapter.CustomViewHolder> {

private Context mContext;
View animatedView = null;

public MyRecyclerViewAdapter(Context context) {
    this.mContext = context;
}

@Override
public CustomViewHolder onCreateViewHolder(ViewGroup viewGroup, final int i) {
    final View view = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.list_row, null);


    CustomViewHolder viewHolder = new CustomViewHolder(view);
    /*final Animation a = AnimationUtils.loadAnimation(mContext, R.anim.scale_up);*/
    view.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            // You can tweak with the effects here
            if (animatedView == null) {
                animatedView = view;
            } else {
                animatedView.setAnimation(null);
                animatedView = view;
            }
            ScaleAnimation fade_in = new ScaleAnimation(1f, 1.3f, 1f, 1.3f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
            fade_in.setDuration(100);     // animation duration in milliseconds
            fade_in.setFillAfter(true);    // If fillAfter is true, the transformation that this animation performed will persist when it is finished.
            view.startAnimation(fade_in);
        }
    });
    return viewHolder;
}

@Override
public void onBindViewHolder(CustomViewHolder customViewHolder, int i) {
    //Setting text view title
    customViewHolder.textView.setText("Data No. " + i);
}

@Override
public int getItemCount() {
    return 10;
}

public class CustomViewHolder extends RecyclerView.ViewHolder {
    protected ImageView imageView;
    protected TextView textView;

    public CustomViewHolder(View view) {
        super(view);
        this.imageView = (ImageView) view.findViewById(R.id.thumbnail);
        this.textView = (TextView) view.findViewById(R.id.title);
    }
}
}

适配器行布局

<!-- list_row.xml -->
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:orientation="vertical">

<RelativeLayout
    android:layout_width="80dp"
    android:layout_height="match_parent">

    <ImageView
        android:id="@+id/thumbnail"
        android:layout_width="100dp"
        android:layout_height="80dp"
        android:layout_alignParentLeft="true"
        android:layout_centerInParent="true"
        android:scaleType="centerCrop"
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/thumbnail"
        android:layout_centerHorizontal="true"
        android:text="dafdafda"
        android:textColor="#222"
        android:textSize="12sp" />

</RelativeLayout>

</LinearLayout>

除了你还可以使用TwoWayView它提供实现的功能HorizontalListView,

以上只是一些可能需要一些调整的演示代码,请告诉我这是否有帮助或进一步询问......

还添加输出的屏幕截图..

Answer 2

步骤1：

在 中水平显示图像ViewPager。

第2步：

将ScaleAnimation类应用于单击的项目以放大它。这可以在的instantiateItem()方法中完成。ViewPagerPagerAdapter

此外，还有一些现成的开源小部件可用，例如CoverFlow和FancyCoverFlow。您可能想查看源代码以了解它们是如何工作的。

编辑：

首先，关于如何处理未知数量的图像的问题，您应该意识到，在所有此类小部件（ListView、等）中，来自 APIGridView的ViewPager对象数量一开始总是未知的，即何时才知道收到 API 响应。ViewPager因此，如果您首先以正常方式实现 a ，您将看到它是如何处理的。基本上，您必须使用Adapter和 模型对象来填充ViewPager或ListView。API 响应将是 JSON 或 XML，解析它后，您将知道确切的项目数。

所以我认为你应该首先以ViewPager正常的方式实现 a 。有很多可用的例子。两个有趣的是这个和这个。它们对您的案例很有趣，因为它们还包含如何放大图像的示例代码。

现在来讨论第二个问题：如何放大图像。为此，一种方法是使用该类ScaleAnimation。例如，假设您想要将图像中心周围放大 100%：

ScaleAnimation scaleAnimation =  new ScaleAnimation(1.0f, 1.5f,
                                                    1.0f, 1.5f,
                                                        Animation.RELATIVE_TO_SELF, 0.5f,
                                                        Animation.RELATIVE_TO_SELF, 0.5f);

scaleAnimation.setDuration(200);
scaleAnimation.setInterpolator(new AccelerateDecelerateInterpolator());

imageView.startAnimation(scaleAnimation);

instantiateItem()我会在的方法中在ViewPager图像上使用此代码PagerAdapter。这应该有效。或者您可以尝试前面两个示例之一中的缩放动画方法。

恐怕您将不得不尝试使用这些示例作为指导来创建一个工作项目。然后我们可以进一步讨论您面临的任何其他问题。我确信这可以很容易地完成，而且我知道你也能做到。最好的 ...

编辑2：

根据你给出的两个例子，你见过这个和这个吗？这就是您要找的吗？它会让你更接近解决问题吗？