Question

我正在开发一个应用程序，它需要显示带有文本的两列图像，并同步它们的滚动（类似Pinterest）。

//////////////////
/ /
/图像/
/ /
//////////////////
/文字/
//////////////////
/文字/
//////////////////

到目前为止，我使用以下布局来实现这一目标。

<ScrollViewEx
    android:id="@+id/content"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="30"
    android:scrollbars="none"
    android:overScrollMode="never">
    <TableLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ffffff"
        android:gravity="center_horizontal"
        android:shrinkColumns="0,1"
        android:stretchColumns="0,1">
        <TableRow
            android:id="@+id/tableRow"
            android:layout_width="fill_parent">
            <MvxLinearLayoutCustomAdapter
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="fill_parent"
                android:orientation="vertical"
                android:id="@+id/left_layout"
                android:padding="10dp"
                local:MvxBind="ItemsSource items1"
                local:MvxItemTemplate="@layout/custom_item" />
            <MvxLinearLayoutCustomAdapter
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="fill_parent"
                android:orientation="vertical"
                android:id="@+id/right_layout"
                android:padding="10dp"
                local:MvxBind="ItemsSource items2"
                local:MvxItemTemplate="@layout/custom_item" />
        </TableRow>
    </TableLayout>
</ScrollViewEx>

请注意，我为该LinearLayout使用自定义适配器，目的是使用AQuery C＃绑定在我的自定义项目布局中将图像加载到ImageView中，并为图像设置各种高度（以生成瀑布UI）。我的适配器代码是：

public class MvxClickableLinearLayoutAdapter : MvxAdapterWithChangedEvent
{
    IEnumerable<ItemViewModel> src;
    Bitmap imgLoading;
    Context _context;
    public MvxClickableLinearLayoutAdapter(Context context)
        : base(context)
    {
    }

    protected override View GetView(int position, View convertView, ViewGroup parent, int templateId)
    {
        AQuery aq = null;
        var view = convertView;
        if (view == null)
            view = base.GetView(position, convertView, parent, templateId);
        aq = new AQuery(view);
        if (imgLoading == null)
            imgLoading = aq.GetCachedImage(Resource.Drawable.load);
        if (src == null)
            src = (parent as MvxLinearLayout).ItemsSource.Cast<ItemViewModel>();
        var item = src.ElementAt(position);
        var imageUrl = item.ImageUrl;

        var img = (AQuery)aq.Id(Resource.Id.news_img); 

        img.Image(imageUrl, false, false, 0, 0, imgLoading, 0);
        img.Height(item.Height, true);
        return view;
    }

我的问题是表现。适配器加载所有元素，这使我无法使用ViewHolder模式。即使我加载了大量的项目，适配器也不会尝试重用以前加载的视图并使我的滚动不那么顺利。我认为这是因为我使用ScrollView。所以我认为我的答案是ListView。

我尝试按照answer中的描述实现自定义ListView，但我无法将两个ListView同步（不想覆盖 OnScrollChanged方法，因为我尝试过，其中两个之间存在延迟）。我还需要控制每个项目的高度，因此无法使用两个自定义项目制作一个ListView，如上图所示。

使用带有自定义适配器的LinearLayouts，有什么办法可以实现ListView吗？或者使用ScrollView，可能通过修改适配器？提前谢谢。

Answer 1

您可以使用MvxRecyclerView。那个应该更好的表现，并有一些滚动事件的钩子。

您可以像这样使用适配器：

var recyclerView = view.FindViewById<MvxRecyclerView>(Resource.Id.my_recycler_view); 
if (recyclerView != null) { 
    recyclerView.Adapter = new MyRecyclerViewAdapter((IMvxAndroidBindingContext)BindingContext); 
}

然后将滚动添加到第二个列表中：

recyclerView1.ScrollChange += (object sender, View.ScrollChangeEventArgs e) => { 
    recyclerView2.ScrollY = e.ScrollY; 
};

如何使用MvvmCross使不同高度的项目同步ListViews？

1 个答案: