Unable to get correct design for fragment transaction

currently i am trying to create a fragment design that will show when the plus button is clicked. It looks like this.

This is what i am getting.

this is the code for the fragment to display.
promptFragment xml:

<android.support.constraint.ConstraintLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">


<LinearLayout
android:id="@+id/linearLayout2"
android:layout_width="316dp"
android:layout_height="250dp"
android:layout_marginStart="8dp"
android:layout_marginTop="24dp"
android:background="@drawable/promptforadd"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.433"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">


<TextView
android:id="@+id/textViewTakePhoto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:paddingBottom="180dp"
android:text="Take Photo"
android:textSize="24sp" />


</LinearLayout>

<Button
android:id="@+id/buttonCancel"
android:layout_width="316dp"
android:layout_height="56dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="50dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="@drawable/cancelbutton"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/linearLayout2"
app:layout_constraintVertical_bias="1.0" />


This is the current design corresponding to the above xml file.

This is the code to inflate my fragment.

public class PromptFragment extends Fragment {

TextView textViewTakePhoto;
TextView textViewAlbum;
TextView textViewAddOutfit;
Button buttonCancel;

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.layout_promptforadd,container,false);
textViewTakePhoto = v.findViewById(R.id.textViewTakePhoto);
//textViewAlbum = v.findViewById(R.id.textViewAlbum);
//textViewAddOutfit = v.findViewById(R.id.textViewAddOutfit);
buttonCancel = v.findViewById(R.id.buttonCancel);

buttonCancel.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(v.getContext(),"you clicked on button ",Toast.LENGTH_SHORT).show();
}
});
return v;
}
}


I added a frame layout inside the home activity where i want my fragment to inflate. I use fragment transaction to add my fragment in the frame layout. My fragment design does not even correspond to the output that i am getting so I am not sure how to go about doing it.

1 Answer
1

Okay i managed to solve it ! here is the xml file for anyone who is interested.

promptFrag xml:

<RelativeLayout 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"
android:layout_width="match_parent"
android:layout_height="match_parent">


<Button
android:id="@+id/buttonCancel"
android:layout_width="316dp"
android:layout_height="56dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10dp"
android:background="@drawable/cancelbutton" />

<ImageView
android:id="@+id/imageView3"
android:layout_width="316dp"
android:layout_height="217dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="80dp"
android:background="@drawable/promptforadd"
android:contentDescription="@null" />

<TextView
android:id="@+id/textViewTakePhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="247dp"
android:text="Take Photo"
android:textSize="24sp" />

<TextView
android:id="@+id/textViewAlbum"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="170dp"
android:text="Choose from album"
android:textSize="24sp" />

<TextView
android:id="@+id/textViewAddOutfit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="99dp"
android:text="Add Outfit"
android:textSize="24sp" />

</RelativeLayout>


By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.