自定义ViewGroup,在特定位置插入子项

时间:2016-02-22 18:38:10

标签: android xamarin android-custom-view viewgroup android-viewgroup

我的Android应用中有几个具有相同基本结构的活动,我正在尝试让我的布局干掉。重复的代码如下所示。它包含一个可滚动区域,页脚具有“后退”和“仪表板”链接。还有一个FrameLayout用于在可滚动区域的顶部应用渐变。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">
        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="689px">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <!-- THE REAL PAGE CONTENT GOES HERE -->

            </LinearLayout>
        </ScrollView>
        <ImageView
            android:src="@drawable/GradientBar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom" />
    </FrameLayout>
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="50px"
        android:background="?attr/primaryAccentColor">
        <Button
          android:layout_width="wrap_content"
          android:layout_height="26px"
          android:layout_gravity="center_vertical"
          local:MvxBind="Click GoBackCommand" />
        <Button
          android:layout_width="wrap_content"
          android:layout_height="26px"
          local:MvxBind="Click ShowDashboardHomeCommand" />
    </FrameLayout>
</LinearLayout>

为了重复我的活动,我认为我需要做的是创建一个继承自LinearLayout的自定义ViewGroup。在该代码中,从XML文件加载上述内容。丢失的地方是如何让Activity中的子内容加载到正确的位置。例如。假设我的活动现在包含:

<com.myapp.ScrollableVerticalLayoutWithDashboard
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- THE REAL PAGE CONTENT GOES HERE -->
    <TextView android:text"blah blah blah" />

</com.myapp.ScrollableVerticalLayoutWithDashboard>

现在我如何让“等等等等”出现在正确的位置?我很确定如果我这样做了,我最终会在页面的顶部或底部显示“blah blah blah”,而不是根据需要在ScrollView的中间。

我正在使用API​​ 21 / v5.0 +。从技术上讲,我正在用Xamarin做这一切,但希望这与答案无关?

编辑:结果如下所示。页脚和渐变是自定义ViewGroup的一部分,但其余部分将是自定义ViewGroup中的内容。

Mockup

1 个答案:

答案 0 :(得分:3)

我不了解Xamarin所以这是一个原生的Android解决方案,但应该很容易翻译。

  

我认为我需要做的是创建一个继承自的ViewGroup   一个LinearLayout。

是的,您可以扩展LinearLayout类。

  

我迷失的地方是如何获取活动中的孩子内容   加载到正确的位置。

在自定义实现中,您需要手动处理子项。在该自定义类的构造函数中手动膨胀布局:

private LinearLayout mDecor;

public ScrollableVerticalLayoutWithDashboard(Context context, AttributeSet attrs) {
      super(context, attrs);
      // inflate the layout directly, this will pass through our addView method
      LayoutInflater.from(context).inflate(R.layout.your_layout, this);
}

然后覆盖addView()(ViewGroup用来附加它的子节点)方法来处理不同类型的视图:

    private LinearLayout mDecor;

    public void addView(View child, int index, ViewGroup.LayoutParams params) {
        // R.id.decor will be an id set on the root LinearLayout in the layout so we can know
        // the type of view
        if (child.getId() != R.id.decor) {
            // this isn't the root of our inflated view so it must be the actual content, like
            // the bla bla TextView
            // R.id.content will be an id set on the LinearLayout inside the ScrollView where
            // the content will sit
            ((LinearLayout) mDecor.findViewById(R.id.content)).addView(child, params);
            return;
        }
        mDecor = (LinearLayout) child; // keep a reference to this static part of the view
        super.addView(child, index, params); // add the decor view, the actual content will
        // not be added here
    }

在Xamarin中,您正在寻找要覆盖的https://developer.xamarin.com/api/member/Android.Views.ViewGroup.AddView/p/Android.Views.View/System.Int32/Android.Views.ViewGroup+LayoutParams/方法。请记住,这是一个简单的实现。

编辑:您可以使用&#39;合并&#39;而不是将LinearLayout放在LinearLayout中。标签。这是您想要的最终布局:

<?xml version="1.0" encoding="utf-8" ?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res-auto">
  <FrameLayout
      android:id="@+id/svfFrame1"
      android:layout_width="match_parent"
      android:layout_height="0dp"
      android:layout_weight="1">
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="689px">
      <LinearLayout
          android:id="@+id/svfContentLayout"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:orientation="vertical"
          android:paddingBottom="23px" />
    </ScrollView>
    <ImageView
        android:src="@drawable/GradientBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom" />
  </FrameLayout>
  <FrameLayout
      android:id="@+id/svfFrame2"
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:local="http://schemas.android.com/apk/res-auto"
      android:layout_width="match_parent"
      android:layout_height="50px"
      android:background="?attr/primaryAccentColor">
    <Button
      android:id="@+id/FooterBackButton"
      android:layout_width="wrap_content"
      android:layout_height="26px"
      android:layout_gravity="center_vertical"
      android:layout_marginLeft="24px" />
    <Button
      android:id="@+id/FooterDashboardButton"
      android:layout_width="wrap_content"
      android:layout_height="26px"
      android:layout_gravity="center_vertical|right"
      android:layout_marginRight="24px" />
  </FrameLayout>
</merge>

这是基于该布局的Xamarin的最终工作C#视图:

public class ScrollableVerticalLayoutWithDashboard: LinearLayout
{
    public ScrollableVerticalLayoutWithDashboard(Context context, IAttributeSet attrs) : base(context, attrs)
    {
        LayoutInflater.From(context).Inflate(Resource.Layout.ScrollableVerticalFooter, this);
        base.Orientation = Orientation.Vertical;
    }

    public override void AddView(View child, int index, ViewGroup.LayoutParams @params)
    {
        // Check to see if the child is either of the two direct children from the layout
        if (child.Id == Resource.Id.svfFrame1 || child.Id == Resource.Id.svfFrame2)
        {
            // This is one of our true direct children from our own layout.  Add it "normally" using the base class.
            base.AddView(child, index, @params);
        }
        else
        {
            // This is content coming from the parent layout, not our own inflated layout.  It 
            //   must be the actual content, like the bla bla TextView.  Add it at the appropriate location.
            ((LinearLayout)this.FindViewById(Resource.Id.svfContentLayout)).AddView(child, @params);
        }
    }
}