我将使用 MvvmCross 数据绑定针对集合绑定的 FrameLayout 来实现这一点。
该方法的核心使用在parent 中包含的 parent 中 child 的TranslationX
andTranslationY
属性。View
FrameLayout
父母是:
<?xml version="1.0" encoding="utf-8"?>
<pointsongrid.BindableFrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res/points.on.grid"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
local:MvxBind="ItemsSource Points"
local:MvxItemTemplate="@layout/item"/>
列表项是:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res/points.on.grid"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
local:MvxBind="TranslationX X, Converter=X;TranslationY Y, Converter=Y"
>
<LinearLayout
android:layout_width="20dp"
android:layout_height="20dp"
local:MvxBind="BackgroundColor Color, Converter=NativeColor"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
local:MvxBind="Text Player"
/>
</LinearLayout>
StackOverflow 的整个代码有点长,所以我发布了一个快速仓库来演示 - https://github.com/slodge/MvvmCross-Players - 那里的数据绑定 FrameLayout 肯定可以改进 - 看看 LinearLayout 代码如果您需要对更改列表的支持(例如 ObservableCollection),请参考主要的 MvvmCross 存储库。
结果看起来有点像:
![在此处输入图像描述](https://i.stack.imgur.com/NhJ1Q.png)