首页 > 解决方案 > 如何在框架布局下方动态添加线性布局?

问题描述

我有一个扩展 FrameLayout 的类,称为 TinderStackLayout。

此类有一个名为“addCard()”的方法,它将名为 TinderCardView 的动态自定义视图膨胀到主堆栈布局中。

我需要在被充气的卡片下方添加一个线性布局。

这是我的 TinderStackLayout -

public class TinderStackLayout extends FrameLayout {

  // Constants
  private static final int DURATION = 300;

  // Variable members
  private OnCardSwipedListener onCardSwipedListener;
  private int screenWidth;
  private int yMultiplier;

  //Top card
  private TinderCardView topCardOnStack;

  private LinearLayout mButtonsContainer;
  private Button mDeleteButton, mPassButton, mApproveButton;


  //Constructors
  public TinderStackLayout(Context context) {
    super(context);
    init();
  }

  public TinderStackLayout(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
  }

  public TinderStackLayout(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init();
  }

  @Override
  public void addView(View child, int index, ViewGroup.LayoutParams params) {
    super.addView(child, index, params);
    if (onCardSwipedListener != null)
      onCardSwipedListener.onNext(getChildCount());
  }


  @Override
  public void removeView(View view) {
    super.removeView(view);
    if (onCardSwipedListener != null)
      onCardSwipedListener.onNext(getChildCount());
  }

  @Override
  public void onDetachedFromWindow() {
    super.onDetachedFromWindow();
  }

  // Helper Methods
  private void init() {
    setClipChildren(false);
    screenWidth = DisplayUtility.getScreenWidth(getContext());
    yMultiplier = DisplayUtility.dp2px(getContext(), 8);

    mButtonsContainer = new LinearLayout(getContext());
    mButtonsContainer.setOrientation(LinearLayout.HORIZONTAL);

    mDeleteButton = new Button(getContext());
    mDeleteButton.setText("Delete");
    mPassButton = new Button(getContext());
    mPassButton.setText("Pass");
    mApproveButton = new Button(getContext());
    mApproveButton.setText("Approve");

    mButtonsContainer.addView(mDeleteButton);
    mButtonsContainer.addView(mPassButton);
    mButtonsContainer.addView(mApproveButton);

    RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    layoutParams.addRule(RelativeLayout.ALIGN_BOTTOM);
    addView(mButtonsContainer, layoutParams);
  }

  public void addCard(TinderCardView tinderCardView) {
    View firstCard = getChildAt(0);

    if (firstCard != null && firstCard.equals(tinderCardView)) {
      return;
    }

    if (onCardSwipedListener == null)
      onCardSwipedListener = tinderCardView.getOnCardSwipedListener();

    topCardOnStack = tinderCardView;

    ViewGroup.LayoutParams layoutParams;
    layoutParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);

    int childCount = getChildCount();
    addView(tinderCardView, 0, layoutParams);

    float scaleValue = 1 - (childCount / 50.0f);

    tinderCardView.animate()
        .x(0)
        .y(childCount * yMultiplier)
        .scaleX(scaleValue)
        .setInterpolator(new AnticipateOvershootInterpolator())
        .setDuration(DURATION);
  }

  public TinderCardView getTopCardOnStack() {
    return topCardOnStack;
  }
}

正如你所看到的,我添加了一个带有 3 个按钮的线性布局,但结果是它在屏幕的左上角而不是在创建的卡片的底部膨胀。

如何更改创建的线性布局的位置?

编辑 -

尝试了 Shayan D 的建议,这是我新的基于线性布局的课程 -

package com.etiennelawlor.tinderstack.ui;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.AnticipateOvershootInterpolator;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.LinearLayout;

import com.etiennelawlor.tinderstack.R;
import com.etiennelawlor.tinderstack.bus.events.OnCardSwipedListener;
import com.etiennelawlor.tinderstack.utilities.DisplayUtility;

public class TinderStackLinear extends LinearLayout {

  // Constants
  private static final int DURATION = 300;

  // Variable members
  private OnCardSwipedListener onCardSwipedListener;
  private int screenWidth;
  private int yMultiplier;

  //Top card
  private TinderCardView topCardOnStack;

  private FrameLayout mCardsContainer;
  private LinearLayout mButtonsContainer;
  private Button mDeleteButton, mPassButton, mApproveButton;


  public TinderStackLinear(Context context) {
    super(context);
    init();
  }

  public TinderStackLinear(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
  }

  public TinderStackLinear(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init();
  }

  @Override
  public void setOrientation(int orientation) {
    super.setOrientation(HORIZONTAL);
  }

  private void init(){
    setClipChildren(false);
    screenWidth = DisplayUtility.getScreenWidth(getContext());
    yMultiplier = DisplayUtility.dp2px(getContext(), 8);

    mCardsContainer = new FrameLayout(getContext()) {
      @Override
      public void addView(View child, int index, ViewGroup.LayoutParams params) {
        super.addView(child, index, params);
        if (onCardSwipedListener != null)
          onCardSwipedListener.onNext(getChildCount());
      }

      @Override
      public void removeView(View view) {
        super.removeView(view);
        if (onCardSwipedListener != null)
          onCardSwipedListener.onNext(getChildCount());
      }

      @Override
      public void onDetachedFromWindow() {
        super.onDetachedFromWindow();
      }

    };

    mButtonsContainer = new LinearLayout(getContext());;
    mButtonsContainer.setOrientation(LinearLayout.HORIZONTAL);

    mDeleteButton = new Button(getContext());
    mDeleteButton.setText(R.string.tinder_stack_layout_delete);
    mPassButton = new Button(getContext());
    mPassButton.setText(R.string.tinder_stack_layout_pass);
    mApproveButton = new Button(getContext());
    mApproveButton.setText(R.string.tinder_stack_layout_approve);

    mButtonsContainer.addView(mDeleteButton);
    mButtonsContainer.addView(mPassButton);
    mButtonsContainer.addView(mApproveButton);

    LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
    addView(mCardsContainer, layoutParams);
    addView(mButtonsContainer, layoutParams);
  }

  public void addCard(TinderCardView tinderCardView) {
    View firstCard = mCardsContainer.getChildAt(0);

    if (firstCard != null && firstCard.equals(tinderCardView)) {
      return;
    }

    if (onCardSwipedListener == null)
      onCardSwipedListener = tinderCardView.getOnCardSwipedListener();

    topCardOnStack = tinderCardView;

    ViewGroup.LayoutParams layoutParams;
    layoutParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);

    int childCount = mCardsContainer.getChildCount();
    mCardsContainer.addView(tinderCardView, 0, layoutParams);

    float scaleValue = 1 - (childCount / 50.0f);

    tinderCardView.animate()
        .x(0)
        .y(childCount * yMultiplier)
        .scaleX(scaleValue)
        .setInterpolator(new AnticipateOvershootInterpolator())
        .setDuration(DURATION);
  }

  public TinderCardView getTopCardOnStack() {
    return topCardOnStack;
  }

  @Override
  public void addView(View child, int index, ViewGroup.LayoutParams params) {
    super.addView(child, index, params);
    if (onCardSwipedListener != null)
      onCardSwipedListener.onNext(getChildCount());
  }


  @Override
  public void removeView(View view) {
    super.removeView(view);
    if (onCardSwipedListener != null)
      onCardSwipedListener.onNext(getChildCount());
  }

  @Override
  public void onDetachedFromWindow() {
    super.onDetachedFromWindow();
  }

  public FrameLayout getCardsContainer() {
    return mCardsContainer;
  }

  public LinearLayout getButtonsContainer() {
    return mButtonsContainer;
  }
}

标签: androidandroid-framelayout

解决方案


推荐阅读