Donate. I desperately need donations to survive due to my health

Get paid by answering surveys Click here

Click here to donate

Remote/Work from Home jobs

Fragment inside Custom View

I've created a custom view which when you click on the view it expands and shows some additional information and a video, but the video is optional so I did a fragment and if the video is available I start the fragment, otherwise no. I'm adding this custom view on a GridLayout. Here's the problem, when I click on a view the video just show up on the first view of the list. Does anyone know why is this happening and how to solve this issue?

Custom View layout code:

<merge xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <LinearLayout
        android:id="@+id/short_description_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:padding="16dp"
        tools:visibility="gone">

        <TextView
            android:id="@+id/step_number_short"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="16dp"
            android:textColor="@android:color/black"
            android:textSize="16sp" />

        <TextView
            android:id="@+id/short_description"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@android:color/black"
            android:textSize="16sp" />

    </LinearLayout>

    <android.support.constraint.ConstraintLayout
        android:id="@+id/long_description_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:visibility="gone">

        <TextView
            android:id="@+id/step_number_long"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@android:color/black"
            android:textSize="16sp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/long_description"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="16dp"
            android:textColor="@android:color/black"
            android:textSize="16sp"
            app:layout_constraintStart_toEndOf="@+id/step_number_long"
            app:layout_constraintTop_toTopOf="@+id/step_number_long" />

        <FrameLayout
            android:id="@+id/step_content"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@id/long_description" />

    </android.support.constraint.ConstraintLayout>

</merge>

Custom View code:

public class StepView extends CardView {
    private LinearLayout shortDescriptionLayout;
    private ConstraintLayout longDescriptionLayout;

    public StepView(Context context) {
        super(context);
        init(null);
    }

    public StepView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(attrs);
    }

    public StepView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(attrs);
    }

    public void setStep(Step step) {
        initializeViews(step);
    }

    @Override
    public void setOnClickListener(@Nullable OnClickListener l) {
        super.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                StepView.this.onClick();
            }
        });
    }

    public void onClick() {
        if (shortDescriptionLayout.getVisibility() == View.GONE) {
            shortDescriptionLayout.setVisibility(View.VISIBLE);
            longDescriptionLayout.setVisibility(View.GONE);
            stopPlayer();
        } else {
            shortDescriptionLayout.setVisibility(View.GONE);
            longDescriptionLayout.setVisibility(View.VISIBLE);
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        GridLayout.LayoutParams params = (GridLayout.LayoutParams) getLayoutParams();
        params.height = ViewGroup.LayoutParams.WRAP_CONTENT;
        params.width = ViewGroup.LayoutParams.MATCH_PARENT;
        params.bottomMargin = ScreenUtils.dpToPixels(getContext(), 8);
        params.rightMargin = ScreenUtils.dpToPixels(getContext(), 8);
        params.leftMargin = ScreenUtils.dpToPixels(getContext(), 8);
        params.topMargin = ScreenUtils.dpToPixels(getContext(), 8);
    }

    private void init(@Nullable AttributeSet set) {
        LayoutInflater.from(getContext()).inflate(R.layout.view_step, this, true);
        shortDescriptionLayout = findViewById(R.id.short_description_layout);
        longDescriptionLayout = findViewById(R.id.long_description_layout);
        setOnClickListener(null);

        if (set == null) {
            return;
        }
        TypedArray typedArray = getContext().obtainStyledAttributes(set, R.styleable.StepView);
        int stepNumber = typedArray.getInteger(R.styleable.StepView_step_number, -1);
        String shortDescription = typedArray.getString(R.styleable.StepView_short_description);
        String longDescription = typedArray.getString(R.styleable.StepView_long_description);
        String videoUrl = typedArray.getString(R.styleable.StepView_video_url);
        String thumbnailUrl = typedArray.getString(R.styleable.StepView_thumbnail_url);
        typedArray.recycle();
        Step step = new Step(stepNumber, shortDescription, longDescription, videoUrl, thumbnailUrl);
        initializeViews(step);
    }


    private void initializeViews(Step step) {
        TextView stepNumberShort = shortDescriptionLayout.findViewById(R.id.step_number_short);
        stepNumberShort.setText(Integer.toString(step.getId()));
        TextView shortDescription = shortDescriptionLayout.findViewById(R.id.short_description);
        shortDescription.setText(step.getShortDescription());

        TextView stepNumberLong = longDescriptionLayout.findViewById(R.id.step_number_long);
        stepNumberLong.setText(Integer.toString(step.getId()));
        TextView longDescription = longDescriptionLayout.findViewById(R.id.long_description);
        longDescription.setText(step.getLongDescription());
        setUpContent(step.getVideoUrl());
    }

    private void setUpContent(String videoUrl) {
        FragmentActivity activity = (FragmentActivity) getContext();
        FragmentManager fragmentManager = activity.getSupportFragmentManager();
        if (!videoUrl.isEmpty()) {
            fragmentManager.beginTransaction()
                    .replace(R.id.step_content, new ExoPlayerFragment())
                    .commit();
        }
    }

    private void stopPlayer() {
        //TODO: Stop player here
    }
}

Example: In the last picture the black rectangle should be in the second view, not in the first one.

when your first open the activity

When you click on the view

The problem, this black rectangle should be on the second view

Comments