Develop Reference

set transperent background for constraint layout in android

hi I have to make a view like the below image .
But when i make the parent view transperent , default background is showing like this:
a transperent view is showing behind the main view.
my xml starts like :
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="wrap_content"
android:layout_margin="#dimen/_8sdp"
android:background="#color/red"
android:clipChildren="false"
android:clipToPadding="false">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/cl2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_50sdp"
android:background="#drawable/rounded_corner_shadow"
android:clipChildren="false"
android:clipToPadding="false"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<FrameLayout
android:id="#+id/progressLayout_frame"
android:layout_width="#dimen/_90sdp"
android:layout_height="#dimen/_90sdp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp"
android:clickable="true"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<View
android:id="#+id/bgCircle"
android:layout_width="#dimen/_70sdp"
android:layout_height="#dimen/_70sdp"
android:layout_gravity="center"
android:alpha="0.7"
android:background="#color/white"
android:visibility="visible" />
<RelativeLayout
android:id="#+id/progressLayout"
android:layout_width="#dimen/_80sdp"
android:layout_height="#dimen/_80sdp"
android:layout_gravity="center"
android:background="#android:color/transparent"
android:clickable="true"
>
<ProgressBar
android:id="#+id/progressbar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="#dimen/_80sdp"
android:layout_height="#dimen/_80sdp"
android:layout_centerHorizontal="true"
android:background="#drawable/circle_shape"
android:progressDrawable="#drawable/circular_progress_bar" />
<TextView
android:id="#+id/tvTimeCount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginTop="60dp"
android:text="00:00"
android:textColor="#FFFFFF"
android:textSize="29sp"
app:customTypeFace="roboto_light" />
how can I hide the view behind . why does this layout come ? any suggestions would be helpful . thanks in advance

To remove default background of the dialog...
Step 1:
Create a custom_dialog.xml
<androidx.constraintlayout.widget.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="wrap_content"
android:layout_marginHorizontal="#dimen/_20sdp"
android:paddingHorizontal="#dimen/_25sdp"
android:paddingVertical="#dimen/_25sdp" >
<androidx.constraintlayout.widget.Guideline
android:id="#+id/left_vertical_gl"
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.02" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/right_vertical_gl"
android:layout_width="match_parent"
android:layout_height="1dp"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.98" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/center_horizontal_gl"
android:layout_width="match_parent"
android:layout_height="1dp"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.48" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/top_horizontal_gl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.044" />
<androidx.constraintlayout.widget.Guideline
android:id="#+id/end_horizontal_gl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.90" />
<TextView
android:id="#+id/textView9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="#font/segui_black"
android:text="Are You Sure?"
android:textColor="#484A67"
android:textSize="#dimen/_24ssp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/top_horizontal_gl" />
<TextView
android:id="#+id/textView10"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_2sdp"
android:layout_marginBottom="12dp"
android:fontFamily="#font/segoe"
android:gravity="center"
android:text="Are you sure you want to sign out?"
android:textColor="#484A67"
android:textSize="#dimen/_11ssp"
app:layout_constraintEnd_toStartOf="#+id/right_vertical_gl"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView9" />
<TextView
android:id="#+id/yesTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_20sdp"
android:fontFamily="#font/segui_semi_bold"
android:padding="#dimen/_5sdp"
android:text="Yes"
android:textColor="#AD7BFF"
app:layout_constraintEnd_toStartOf="#+id/right_vertical_gl"
app:layout_constraintTop_toBottomOf="#+id/textView10" />
<TextView
android:id="#+id/noTv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="#dimen/_30sdp"
android:fontFamily="#font/segoe"
android:padding="#dimen/_5sdp"
android:text="No"
android:textColor="#6D6E85"
app:layout_constraintBottom_toBottomOf="#+id/yesTv"
app:layout_constraintEnd_toStartOf="#+id/yesTv"
app:layout_constraintTop_toTopOf="#+id/yesTv"
tools:layout_editor_absoluteX="143dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
Step 2:
Go to your dialog activity
Add the below line to your dialog code
popUpDialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
Complete code of the dialog
private lateinit var popUpDialog: Dialog
private fun buyLifeLineDialog() {
popUpDialog.setContentView(R.layout.dialog_buy_lifelines)
popUpDialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
val yesTv = popUpDialog.findViewById<TextView>(R.id.yesTv);
val noTv = popUpDialog.findViewById<TextView>(R.id.noTv);
popUpDialog.show()
yesTv.setOnClickListener {
if (isCheatLl) {
mViewModel.buyCheatLifeline(index,lifeLinesPackagesModel)
}
else{
mViewModel.buyRespawnLifeline(index,lifeLinesPackagesModel)
}
popUpDialog.dismiss()
}
noTv.setOnClickListener {
popUpDialog.dismiss()
}
}

I don't know how do you display this window in your app , but I suppose that you display it as custom dialog , so the problem is that you need to add a transparent theme for your dialog to get the same design or your dialog will fill the transparent spaces with this black color or white depends on your app theme , so to solve this problem you need to add this style in your theme.xml file or style.xml
<style name="AlertDialogCustom" parent="#android:style/Theme.Dialog">
<item name="android:windowBackground">#android:color/transparent</item>
</style>
and then you create a new custom dialog in your activity like this
//Here i will create new dialog with a custom style which I added in Theme.xml
final AlertDialog dialog2 = new AlertDialog.Builder(MainActivity.this,R.style.AlertDialogCustom).create();
LayoutInflater inflater = getLayoutInflater();
//Here I added my xml file , you can replace test with your own xml file
View convertView = (View) inflater.inflate(R.layout.test, null);
dialog2.setView(convertView);
dialog2.setCancelable(false);
//Here we tell the dialog to display , you can call show() when click a button
dialog2.show();
and here it's my simple design to get a transparent background
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="350dp"
android:layout_margin="8dp"
android:background="#android:color/transparent"
android:clipChildren="false"
android:clipToPadding="false">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/cl2"
android:layout_width="350dp"
android:layout_height="350dp"
android:layout_marginTop="50dp"
android:background="#FFFFFF"
android:clipChildren="false"
android:clipToPadding="false"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<FrameLayout
android:id="#+id/progressLayout_frame"
android:layout_width="90dp"
android:layout_height="90dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp"
android:clickable="true"
android:visibility="visible"
app:layout_constraintBottom_toTopOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<View
android:id="#+id/bgCircle"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_gravity="center"
android:background="#drawable/pers_icon"
android:visibility="visible" />
<RelativeLayout
android:id="#+id/progressLayout"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center"
android:background="#android:color/transparent"
android:clickable="true">
</RelativeLayout>
</FrameLayout>
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
tools:layout_editor_absoluteX="218dp"
tools:layout_editor_absoluteY="129dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Now this is the final result , you can make your own design

Android TextView Left Gravity Problem in an Item XML for RecyclerView

I have an RecyclerViewAdapter and I'm preparing an item xml to display my all items as list.
I've written my xml like this:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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:id="#+id/constraintLayoutAutoCompleteTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
android:background="#drawable/bg_film_add_recycler_view">
<TextView
android:id="#+id/textViewFilmName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="false"
android:textSize="16sp"
android:textColor="#color/figma_text_color_dark"
android:fontFamily="#font/inter500_regular"
app:layout_constraintBottom_toBottomOf="#id/imageViewFilmLogo"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/imageViewFilmLogo"
app:layout_constraintTop_toTopOf="#id/imageViewFilmLogo"
tools:text="MyFilm">
</TextView>
<ImageView
android:id="#+id/imageViewFilmLogo"
android:layout_width="80dp"
android:layout_height="30dp"
android:layout_marginStart="30dp"
android:layout_marginVertical="10dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
</ImageView>
</androidx.constraintlayout.widget.ConstraintLayout>
As result of this, I see my RecyclerView like this (red ones are textviews, green ones are imageviews):
As you see, the textviews looks like centered in specific area. But I want aligned to left like this:
I tried to add android:gravity="left" but it doesn't work, what is the problem? can you help me please?
If possible, can you equilaze the distances between "left edge of layout - imageview" and "imageview - left edge of textview"

Use 0dp for views if you wish to set behavior of view like layout_gravity="start" in constraintLayout
And don't forget add margin start for second element
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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:id="#+id/constraintLayoutAutoCompleteTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
android:background="#drawable/bg_film_add_recycler_view">
<TextView
android:id="#+id/textViewFilmName"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:clickable="false"
android:textSize="16sp"
android:textColor="#color/figma_text_color_dark"
android:fontFamily="#font/inter500_regular"
app:layout_constraintBottom_toBottomOf="#id/imageViewFilmLogo"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/imageViewFilmLogo"
app:layout_constraintTop_toTopOf="#id/imageViewFilmLogo"
tools:text="MyFilm">
</TextView>
<ImageView
android:id="#+id/imageViewFilmLogo"
android:layout_width="80dp"
android:layout_height="30dp"
android:layout_marginStart="30dp"
android:layout_marginVertical="10dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent">
</ImageView>
</androidx.constraintlayout.widget.ConstraintLayout>

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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:id="#+id/constraintLayoutAutoCompleteTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
android:background="#drawable/bg_film_add_recycler_view">
<ImageView
android:id="#+id/imageViewFilmLogo"
android:layout_width="80dp"
android:layout_height="30dp"
android:layout_marginStart="30dp"
android:layout_marginVertical="10dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
tools:ignore="ContentDescription">
</ImageView>
<LinearLayout
android:id="#+id/textViewFilmName_container"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintBottom_toBottomOf="#id/imageViewFilmLogo"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="#id/imageViewFilmLogo"
app:layout_constraintTop_toTopOf="#id/imageViewFilmLogo"
android:paddingStart="30dp">
<TextView
android:id="#+id/textViewFilmName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="false"
android:textSize="16sp"
android:textColor="#color/figma_text_color_dark"
android:fontFamily="#font/inter500_regular"
tools:text="MyFilm">
</TextView>
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Pjsip Android: Video Call - Window Preview size issue(SurfaceView is used to display video frames)

I am trying to build SIP call application using Pjsip and so far it is working good.
I am facing one issue in displaying video window.
I am using surface view to display streaming frames.
Please see the attached image below:
I want to remove Black space on both side of my preview.
UI Part:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:layout_height="match_parent">
<SurfaceView
android:id="#+id/surfaceIncomingVideo"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<SurfaceView
android:id="#+id/surfacePreviewCapture"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:layout_width="#dimen/_100sdp"
android:layout_marginBottom="#dimen/_70sdp"
android:layout_height="#dimen/_130sdp" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
app:elevation="0dp">
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.constraint.ConstraintLayout
android:id="#+id/layoutCall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="#id/ivBack"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/ivBack">
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivHabariLogo"
android:layout_width="27dp"
android:layout_height="37dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/call_ic_habari_logo" />
<android.support.v7.widget.AppCompatTextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/_8sdp"
android:fontFamily="#font/helvetica_neue_regular"
android:text="#string/toolbar_title_video"
android:textSize="#dimen/_14ssp"
android:textColor="#color/grey"
app:layout_constraintBottom_toBottomOf="#+id/ivHabariLogo"
app:layout_constraintStart_toEndOf="#+id/ivHabariLogo"
app:layout_constraintTop_toTopOf="#+id/ivHabariLogo" />
</android.support.constraint.ConstraintLayout>
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivBack"
android:layout_width="wrap_content"
android:layout_height="?android:attr/actionBarSize"
android:paddingStart="21dp"
android:paddingEnd="5dp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="#drawable/back_arrow_white" />
</android.support.constraint.ConstraintLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/layoutUser"
android:layout_marginTop="#dimen/_24sdp"
android:layout_width="match_parent"
android:layout_height="#dimen/_100sdp" >
<RippleBackground
android:id="#+id/callRinging"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:rb_color="#color/ringing_1"
android:layout_gravity="center"
app:rb_duration="2500"
app:rb_radius="#dimen/_40sdp"
app:rb_rippleAmount="3"
app:rb_scale="2">
</RippleBackground>
<RadarViewUsersView
android:id="#+id/radarViewUser"
android:layout_width="#dimen/_100sdp"
android:layout_height="#dimen/_100sdp"
android:layout_gravity="center">
</RadarViewUsersView>
</FrameLayout>
<android.support.v7.widget.AppCompatTextView
android:id="#+id/tvCalleeName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_marginTop="#dimen/_8sdp"
android:textColor="#color/white"
android:textSize="#dimen/_16ssp"
android:fontFamily="#font/helvetica_neue_regular" />
<android.support.v7.widget.AppCompatTextView
android:id="#+id/tvCallState"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#color/white"
android:text="#string/sip_call_state_calling"
android:fontFamily="#font/helvetica_neue_regular"
android:layout_marginTop="#dimen/_2sdp"
android:textSize="#dimen/_12ssp" />
</LinearLayout>
</FrameLayout>
<LinearLayout
android:id="#+id/layoutOutgoingCall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center_vertical"
android:layout_marginBottom="#dimen/_24sdp"
android:visibility="visible"
android:orientation="vertical">
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivEndCall"
android:layout_width="wrap_content"
android:layout_weight="0.25"
android:layout_gravity="center"
android:layout_marginStart="#dimen/_8sdp"
android:layout_marginEnd="#dimen/_8sdp"
android:layout_height="0dp"
android:padding="#dimen/_16sdp"
app:srcCompat="#drawable/ic_call_reject" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivSwitchCamera"
android:layout_width="0dp"
android:layout_weight="0.33"
android:layout_gravity="center"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ic_switch_camera" />
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivDisableVideoCall"
android:layout_width="0dp"
android:layout_weight="0.33"
android:layout_marginStart="#dimen/_8sdp"
android:layout_marginEnd="#dimen/_8sdp"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ic_video_cam_off" />
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivMuteVoiceCall"
android:layout_width="0dp"
android:layout_weight="0.33"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ic_video_mic_on" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/layoutIncomingCall"
android:layout_width="match_parent"
android:gravity="center_vertical"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content"
android:visibility="gone"
android:layout_marginBottom="#dimen/_16sdp"
android:orientation="horizontal">
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivRejectCall"
android:layout_width="0dp"
android:layout_weight="0.1"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ic_call_reject" />
<android.support.v7.widget.AppCompatImageView
android:id="#+id/ivAcceptCall"
android:layout_width="0dp"
android:layout_weight="0.1"
android:layout_height="wrap_content"
app:srcCompat="#drawable/ic_call_accept" />
</LinearLayout>
</RelativeLayout>
Code Part:
In onCreate():
surfaceIncomingVideo.holder.addCallback(this)
surfacePreviewCapture.holder.addCallback(previewHandler)
When preview received:
fun updateVideoPreview(holder: SurfaceHolder) {
if (SipManager.currentCall != null &&
SipManager.currentCall?.mVideoWindow != null &&
SipManager.currentCall?.mVideoPreview != null) {
if (videoPreviewActive) {
val vidWH = VideoWindowHandle()
vidWH.handle?.setWindow(holder.surface)
val vidPrevParam = VideoPreviewOpParam()
vidPrevParam.window = vidWH
try {
SipManager.currentCall?.mVideoPreview?.start(vidPrevParam)
} catch (e: Exception) {
println(e)
}
} else {
try {
SipManager.currentCall?.mVideoPreview?.stop()
} catch (e: Exception) {
println(e)
}
}
}
}
Can anyone help me with that?
Thank you in advance!

Okay so finally I got an answer. It was because of orient I ahve set to rotate my camera view. I think it's internal pjsip issue.

I won't go into ultra details on how to do this but the general idea is this:
A) This is a known / accepted issue with PJSIP. The developer(s) have stated that its "to be expected".
B) The way around this takes a few hoops to jump through:
Add a header to outgoing calls stating your current orientation. DO NOT, change it using PJSIP.
Have your SIP server forward this header to the target client.
Have the target client read this header and rotate the video on the android end.
I am dealing with this as we speak and have the orientation arriving at my view. I'm fairly new to android development so I now need to figure out how to rotate a surfaceview (setRotation not working...) and after how to send an additional request to the client when the orientation changes.
But thats the basic idea... If you want to get rid of the bars and deal with the black bars, thats the route to go.

Imitate TableLayout with ConstraintLayout

I want to do this layout with ConstraintLayout.
But I failed even to do the 1(green) part of it.
What I do is I add 3 TextViews 1,2 and 3 (pink) connect them to the left of parent and tell them to be one under the other. It works.
Then I need to add views 4 and 5 so they always be on the right of 2 and 3 and its content must be aligned vertically to the left edge just as shown on the picture.
The problem that when I add
app:layout_constraintLeft_toRightOf="2 OR 3"
the text in 4 and 5 is not aligned properly. I get this
When I use Guideline I get this
app:layout_constraintLeft_toRightOf="#id/guideline"
Does anyone know what can help with this?
Edit. P.S. layout of 1st attempt
<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:padding="16dp"
android:id="#+id/constraintLayout"
>
<TextView
android:id="#+id/instrument_name"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:text="AUDUSD"
app:layout_constraintStart_toStartOf="#+id/constraintLayout"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"/>
<TextView
android:id="#+id/trade_action_label"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="BUYjhkjhkjhvg"
app:layout_constraintStart_toStartOf="#+id/instrument_name"
app:layout_constraintTop_toBottomOf="#id/instrument_name"
tools:layout_editor_absoluteX="16dp"
android:layout_marginTop="1dp"/>
<TextView
android:id="#+id/net_pl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Net p/l"
app:layout_constraintStart_toStartOf="#+id/trade_action_label"
app:layout_constraintTop_toBottomOf="#id/trade_action_label"/>
<TextView
android:id="#+id/record_amount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="123"
app:layout_constraintTop_toTopOf="#id/trade_action_label"
app:layout_constraintLeft_toRightOf="#id/trade_action_label"
tools:layout_editor_absoluteY="33dp"
/>
<TextView
android:id="#+id/pl_value"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="12"
app:layout_constraintTop_toTopOf="#id/net_pl"
app:layout_constraintLeft_toRightOf="#id/net_pl"/>
</android.support.constraint.ConstraintLayout>
Edit. (screenshot of how the result should look like)

You can use a Barrier to replicate the behavior of the TableLayout.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:text="#string/warehouse"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="8dp"
android:text="#string/hospital"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/textView1" />
<android.support.constraint.Barrier
android:id="#+id/barrier7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="end"
app:constraint_referenced_ids="textView2,textView1" />
<TextView
android:id="#+id/textView3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:text="#string/lorem_ipsum"
app:layout_constraintStart_toEndOf="#+id/barrier7"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
More info here: https://constraintlayout.com/basics/barriers.html

I took a closer look at what you are trying to do. I think that you need to look into using weighted chains in your ConstraintLayout. See the documentation here.
Make sure you use a version of ConstraintLayout that implements chains.
Update
Here is an example of what you are trying to do. I have simplified your layout to better show what will work. Notice the cross linking of box1<->box2 and box3<->box4. These links establish the chains.
<?xml version="1.0" encoding="utf-8"?>
<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:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="81dp">
<TextView
android:id="#+id/box1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginTop="16dp"
android:text="Text box 1 xxxxxxx"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/box2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#id/box2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginTop="0dp"
android:text="Text box 2 yyyyyyyyyy"
app:layout_constraintLeft_toRightOf="#id/box1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#id/box1" />
<TextView
android:id="#+id/box3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginTop="0dp"
android:text="Text box 3 zzzz"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/box4"
app:layout_constraintTop_toBottomOf="#id/box1" />
<TextView
android:id="#id/box4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="0dp"
android:layout_marginTop="0dp"
android:text="Text box 4"
app:layout_constraintLeft_toRightOf="#id/box3"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="#id/box3" />
</android.support.constraint.ConstraintLayout>
Here is an image of the layout.
Use app:layout_constraintHorizontal_weight to effect how much space each view gets.

How can I show different layouts according to the situation in Android?

I set the response after I request an API. I want to display my error screen on the screen according to the status of the response. For example, I want to show this screen when there is a problem with internet connection.
layout_connection_error.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/yemek_hata"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
android:layout_below="#+id/weekCalendar">
<ImageView
android:layout_width="200dp"
android:layout_height="200dp"
android:scaleType="fitXY"
android:src="#drawable/ic_signal_wifi_off"
android:tint="#color/colorGreyLight"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:text="#string/baglanti_hata"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:id="#+id/textView8"
android:textAppearance="#android:style/TextAppearance.Material.Caption"
android:textSize="20sp"
android:textAlignment="center" />
</LinearLayout>
Or I want to show this screen when an unidentified error is encountered.
layout_unidentified_error.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/yemek_hata"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center"
android:layout_below="#+id/weekCalendar">
<ImageView
android:layout_width="200dp"
android:layout_height="200dp"
android:scaleType="fitXY"
android:src="#drawable/ic_bug_report"
android:tint="#color/colorGreyLight"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<TextView
android:text="#string/bilinmeyen_hata"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:id="#+id/textView8"
android:textAppearance="#android:style/TextAppearance.Material.Caption"
android:textSize="20sp"
android:textAlignment="center" />
</LinearLayout>
how can I do that? Thank you very much for anyone who replies

Since they look the same you can just change TextView's text and ImageView's image in code.
textView.setText(R.string.bilinmeyen_hata);
imageView.setImageResource(R.drawable.ic_bug_report);