How to fill screen with rotated webview?

How to fill screen with rotated webview? - android

I have opened a bug report at https://bugs.chromium.org/p/chromium/issues/detail?id=1144713
When I rotate the webview it does not fill the screen.
I want to rotate the webview because AndroidTV requires landscape mode... but we are gonna have the TV in a portrait setting.
i use fill_parent && match_parent but it does not work in either case.
here is a screen shot of Android Studio preview.
Also to note when i test it like this it seems like the webview matchs the screen size but doesn't adapt to the rotation... it just rotates the webview and does not resize it to the new dimensions
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:background="#drawable/game_bg"
android:orientation="vertical"
tools:context="com.surveyswithgames.app.wheel.KeypadActivity">
<FrameLayout
android:id="#+id/frameParent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:layout_marginLeft="2dp"
android:layout_marginStart="2dp"
android:layout_marginTop="2dp"
android:background="#android:color/transparent"
android:foregroundGravity="center"
android:keepScreenOn="true">
<WebView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/keypadWebView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:rotation="-90"
/>
</FrameLayout>
</RelativeLayout>
UPDATE:
Based on the answer https://stackoverflow.com/a/64672893/1815624 I used a custom WebView class, yet it seems like setMeasuredDimension is not functioning...
public class CustomWebView extends WebView {
public CustomWebView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public CustomWebView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomWebView(Context context) {
super(context);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int desiredWidth = MeasureSpec.getSize(heightMeasureSpec);//getMeasuredHeight();
int desiredHeight = MeasureSpec.getSize(widthMeasureSpec);//getMeasuredWidth();
Log.e("CustomWebView", "desiredWidth: "+ desiredWidth);
Log.e("CustomWebView", "desiredHeight: "+ desiredHeight);
setMeasuredDimension(desiredWidth, desiredHeight);
}
}
UPDATE 2:
I had to use the code and layout suggested by the answer https://stackoverflow.com/a/64672893/1815624 and then it worked...Cheers

The issue that you are having is that rotation occurs post-layout. This means that the measurements occur for the landscape mode (width > height) then the view is rotated but the new width is the old height and the new height is the old width. That is what you are seeing and it is not a bug.
One way around this is to create a custom view that swaps the width and height and pivots at the origin -90 degrees then translates the whole view down by the desired height.
Here is the code for the custom view:
RotatedWebView.kt
class RotatedWebView #JvmOverloads constructor(
context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : WebView(context, attrs, defStyleAttr) {
override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
val desiredWidth = MeasureSpec.getSize(heightMeasureSpec)
val desiredHeight = MeasureSpec.getSize(widthMeasureSpec)
translationY = desiredWidth.toFloat()
setMeasuredDimension(desiredWidth, desiredHeight)
}
}
RotatedWebView.java
public class RotatedWebView extends WebView {
public RotatedWebView(Context context) {
super(context);
}
public RotatedWebView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public RotatedWebView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int desiredWidth = MeasureSpec.getSize(heightMeasureSpec);
int desiredHeight = MeasureSpec.getSize(widthMeasureSpec);
setTranslationY(desiredWidth);
setMeasuredDimension(desiredWidth, desiredHeight);
}
}
The layout will look something like this:
activity_main.xml
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:orientation="vertical"
tools:context=".MainActivity">
<FrameLayout
android:id="#+id/frameParent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginStart="2dp"
android:layout_marginLeft="2dp"
android:layout_marginTop="2dp"
android:background="#android:color/transparent"
android:foregroundGravity="center"
android:keepScreenOn="true">
<com.example.webviewrotation.RotatedWebView
android:id="#+id/keypadWebView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:rotation="-90"
android:transformPivotX="0dp"
android:transformPivotY="0dp" />
</FrameLayout>
</RelativeLayout>
And this is the result as seen in an emulator:
It would probably be better to place all the view manipulation into the custom view instead of splitting it between the code and the XML. I assume that you will physically rotate the TV so the web page shows as you want.

Related

ImageView onMeasure in a horizontal RecyclerView

I have a horizontal RecyclerView in my layout that is populated with a CustomImageView which ensures a rounded drawable inside it. When I add these custom views, their width is zero. This RecyclerView is defined as this:
<android.support.v7.widget.RecyclerView
android:id="#+id/chart_months_list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1.5"
android:backgroundTint="#color/saltpan"
/>
Pretty simple. Referring to my CustomImageView, this is the code and their layout:
public class CustomImageView extends ImageView {
public CustomImageView(Context context) {
super(context);
}
public CustomImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
Drawable d = getDrawable();
if (d != null) {
int w = MeasureSpec.getSize(widthMeasureSpec);
int h = w * d.getIntrinsicHeight() / d.getIntrinsicWidth();
double f1 = ((double)w)*0.78;
double f2 = ((double)h)*0.78;
setMeasuredDimension((int)f1, (int)f2);
Log.e("MEASURE", f1+" "+f2);
}
else super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/custom_cell"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/calendar_cell_bg"
android:gravity="center"
android:orientation="vertical"
android:paddingLeft="2.5dp"
android:paddingRight="2.5dp"
android:layout_margin="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<org.madebyalex.myperiod.CustomImageView
android:id="#+id/chart_cell_background"
android:src="#drawable/ball"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center_vertical"
android:adjustViewBounds="true"/>
<TextView
android:id="#+id/chart_month_number"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="AAAA"
android:textColor="#color/saltpan"
android:textSize="35sp"
android:gravity="center_horizontal" />
</RelativeLayout>
</LinearLayout>
This code works properly. I use it in other parts and layout is fully presented. This layout is used in a class with this ctor:
public ChartMonthItem( Context context, RecyclerViewItemClickListener itemClickListener ){
super( context );
this.context = context;
this.itemClickListener = itemClickListener;
selected = false;
View view = LayoutInflater.from( context ).inflate( R.layout.chart_select_option_text_image, this );
CustomImageView backgroundMonth = ( CustomImageView )findViewById( R.id.chart_cell_background );
backgroundMonth.setMinimumWidth( 100 );
drawable = backgroundMonth.getDrawable();
chartMonthNumber = ( TextView )findViewById( R.id.chart_month_number );
}
I forced my ImageView to a minimum width of 100 just for test. Calling invalidate() doesn't work too. after Even with this approach it continues to have a width of zero.
I hoped with this approach I was ensuring a minimum width and the created ImageViews would have proper width based on their parent.
What I doing wrong?

Square layout on GridLayoutManager for RecyclerView

I try to make a grid-layout with square images. I thought that it must be possible to manipulate the GridLayoutManager by manipulating onMeasure to do a
super.onMeasure(recycler, state, widthSpec, widthSpec);
instead of
super.onMeasure(recycler, state, widthSpec, heightSpec);
but unfortunately, that didn't work.
Any ideas?

To have the square elements in my RecyclerView, I provide a simple wrapper for my root View element; I use the following SquareRelativeLayout in place of RelativeLayout.
package net.simplyadvanced.widget;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.RelativeLayout;
/** A RelativeLayout that will always be square -- same width and height,
* where the height is based off the width. */
public class SquareRelativeLayout extends RelativeLayout {
public SquareRelativeLayout(Context context) {
super(context);
}
public SquareRelativeLayout(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareRelativeLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#TargetApi(VERSION_CODES.LOLLIPOP)
public SquareRelativeLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
// Set a square layout.
super.onMeasure(widthMeasureSpec, widthMeasureSpec);
}
}
Then, in my XML layout for the adapter, I've just referenced the custom view as shown in the following. Though, you can do this programmatically also.
<?xml version="1.0" encoding="utf-8"?>
<net.simplyadvanced.widget.SquareRelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/elementRootView"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- More widgets here. -->
</net.simplyadvanced.widget.SquareRelativeLayout>
Note: Depending on which orientation your grid is, then you may want to have the width based off of height (GridLayoutManager.HORIZONTAL) instead of the height being based off the width (GridLayoutManager.VERTICAL).

Constraint layout solves this problem. Use app:layout_constraintDimensionRatio="H,1:1"
recyclerview_grid_layout.xml
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<ImageView
android:id="#+id/imageview"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="H,1:1"
android:scaleType="centerCrop"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
</android.support.constraint.ConstraintLayout>
EDIT
Set ImageView width to 0dp. match_parent is now deprecated for ConstraintLayout.

In case someone would like to scale the view differently - this is how you do it:
private static final double WIDTH_RATIO = 3;
private static final double HEIGHT_RATIO = 4;
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int widthSize = MeasureSpec.getSize(widthMeasureSpec);
int heightSize = (int) (HEIGHT_RATIO / WIDTH_RATIO * widthSize);
int newHeightSpec = MeasureSpec.makeMeasureSpec(heightSize, MeasureSpec.EXACTLY);
super.onMeasure(widthMeasureSpec, newHeightSpec);
}

Starting API 26 (Support Library 26.0), one can use ConstraintLayout that exposes aspect ratio property to force views to be squared:
https://developer.android.com/training/constraint-layout/index.htm
android {
compileSdkVersion 26
buildToolsVersion '26.0.2'
...
}
...
dependencies {
compile 'com.android.support:appcompat-v7:26.0.2'
compile 'com.android.support.constraint:constraint-layout:1.1.0-beta1' //use whatever version is current
}
Example of layout I'm using in GridLayoutManager:
<?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"
android:layout_margin="#dimen/margin_small"
android:background="#drawable/border_gray"
android:gravity="center">
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<!-- place your content here -->
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
app:layout_constraintDimensionRatio="h,1:1" is the key attribute here

A small update for ConstraintLayout for androidx.
Include this line to your build.gradle:
implementation 'androidx.constraintlayout:constraintlayout:2.0.0-beta2'
I wanted to get a RecycleView with GridLayoutManager with square CardViews and I used such a layout for items:
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
>
<androidx.cardview.widget.CardView
android:id="#+id/cardView"
android:layout_width="0dp"
android:layout_height="0dp"
card_view:cardElevation="4dp"
app:layout_constraintDimensionRatio="H,1:1"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
>
On the ConstraintLayout
layout_width="match_parent" is important to let the item fill as much space as RecyclerView provides
layout_height="wrap_content" do not let the item to fill all the height given by RecyclerView, but use the constrained height, provided by ConstraintLayout. In my case, when I used FrameLayout or LinearLayout, the items were "tall".
On the child node, in my case CardView
limiting size to zero is important: layout_width="0dp" and layout_height="0dp" it means, that width and height are contrained
layout_constraintDimensionRatio="H,1:1" makes the desired effect, by setting H you define that height is to be constrained 1:1 is the ratio.
See some detailed explanations on the offsite.

Please, try this extension of the FrameLayout. It performs double measuring to improve consistency. It also supports custom XML properties to set-up required aspect ration from layouts
public class StableAspectFrameLayout extends FrameLayout {
private int aspectWidth = 1;
private int aspectHeight = 1;
public StableAspectFrameLayout(Context context) {
this(context, null, 0);
}
public StableAspectFrameLayout(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public StableAspectFrameLayout(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
extractCustomAttrs(context, attrs);
}
#TargetApi(Build.VERSION_CODES.LOLLIPOP)
public StableAspectFrameLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
extractCustomAttrs(context, attrs);
}
private void extractCustomAttrs(Context context, AttributeSet attrs) {
if (attrs == null) return;
TypedArray a = context.getResources().obtainAttributes(attrs, R.styleable.StableAspectFrameLayout);
try {
aspectWidth = a.getInteger(R.styleable.StableAspectFrameLayout_aspect_width, 1);
aspectHeight = a.getInteger(R.styleable.StableAspectFrameLayout_aspect_height, 1);
} finally {
a.recycle();
}
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int newSpecWidth = MeasureSpec.makeMeasureSpec(getMeasuredWidth(), MeasureSpec.EXACTLY);
int newH = Math.round(((float) getMeasuredWidth()) * aspectHeight / aspectWidth);
int newSpecHeigh = MeasureSpec.makeMeasureSpec(newH, MeasureSpec.EXACTLY);
super.onMeasure(newSpecWidth, newSpecHeigh);
}
}
And the content fo the attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- StableAspectFrameLayout -->
<declare-styleable name="StableAspectFrameLayout">
<attr name="aspect_width" format="integer"/>
<attr name="aspect_height" format="integer"/>
</declare-styleable>
</resources>

Once again, I recommend the relatively recent 'percent' layouts. Using the dependency 'com.android.support:percent:25.2.0', you can do something like this:
<android.support.percent.PercentFrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/image"
app:layout_widthPercent="100%"
app:layout_aspectRatio="100%"
android:padding="10dp"
android:scaleType="centerCrop"
android:cropToPadding="true"
tools:background="#efdbed"
/>
</android.support.percent.PercentFrameLayout>
It's probably much faster than ConstraintLayout, though someday we probably won't care anymore.

I don't like chosen answer so let me provide mine: Instead of wrapping entire item layout in SomeDammyLayoutWithFixedAspectRatio you can hack GridLayoutManager and rewrite code inside measureChild. I've replaced these lines:
if (mOrientation == VERTICAL) {
wSpec = getChildMeasureSpec(availableSpaceInOther, otherDirParentSpecMode,
horizontalInsets, lp.width, false);
hSpec = getChildMeasureSpec(mOrientationHelper.getTotalSpace(), getHeightMode(),
verticalInsets, lp.height, true);
} else {
hSpec = getChildMeasureSpec(availableSpaceInOther, otherDirParentSpecMode,
verticalInsets, lp.height, false);
wSpec = getChildMeasureSpec(mOrientationHelper.getTotalSpace(), getWidthMode(),
horizontalInsets, lp.width, true);
}
to:
if (mOrientation == VERTICAL) {
wSpec = getChildMeasureSpec(availableSpaceInOther, otherDirParentSpecMode,
horizontalInsets, lp.width, false);
hSpec = wSpec;
} else {
hSpec = getChildMeasureSpec(availableSpaceInOther, otherDirParentSpecMode,
verticalInsets, lp.height, false);
wSpec = hSpec;
}
It seems to work fine.
Don't get me wrong, this is quite messy too, but at least this solution doesn't hurt app performance by extending view hierarchy

I had similar problem and I had to inflate the view which would be square in Grid of recycler view. Below is my way of doing it.
Inside onCreateViewHolder method I used the ViewTreeObserver and GlobalLayoutListener to get the measured width of the layout. The layout has match_parent value in the width attribute. Any my recycler view has layout in center horizontal.
final View view = LayoutInflater.from(mActivity).inflate(R.layout.list_item_deals, parent, false);
view.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
int side = view.getMeasuredWidth();
ViewGroup.LayoutParams lp = view.getLayoutParams();
lp.width = side;
lp.height = side;
view.setLayoutParams(lp);
}
});
reference image

center children in a custom RelativeLayout

I have defined a custom relative layout to force a square view in my layout. But I am having trouble centering the children in that relative layout.
My custom RelativeLayout is defined as follows:
public class SquareView extends RelativeLayout {
public SquareView(Context context) {
super(context);
}
public SquareView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int widthSize = MeasureSpec.getSize(widthMeasureSpec);
int heightSize = MeasureSpec.getSize(heightMeasureSpec);
int size;
size = Math.min(widthSize, heightSize);
setMeasuredDimension(size, size);
int finalMeasureSpec = MeasureSpec.makeMeasureSpec(size, MeasureSpec.EXACTLY);
super.onMeasure(finalMeasureSpec, finalMeasureSpec);
}
}
and my xml is as follows:
<com.mypackage.SquareView
android:id="#+id/gameboard_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:padding="0dp" >
<LinearLayout
android:id="#+id/gameboard"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:background="#drawable/xmlgameboard"
android:gravity="center_horizontal"
android:orientation="vertical" >
</LinearLayout>
</com.mypackage.SquareView>
When I view the xml file in graphical view I see the SquareView (gameboard_container) filling all available space (not square), but the child LinearLayout (gameboard) is square.
However, the child LinearLayout (gameboard) is also left justified, where as I require it to be centered.
How would I fix this?
Thank you.

After 3 days of struggling with this I've managed to solve it. The solution was to simply nest my SquareView inside a frame layout. Then I could centre the SquareView using
android:layout_gravity="center_horizontal"

How to make the text in EditText vertically (Android)

(Sorry for my poor question. I have update it now)
How can i make it in XML file? I tried to use following code, but not correct (I used "android:rotation="-90" to do rotation.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:layout_width="141dp"
android:layout_height="200dp"
android:layout_weight="0.41"
android:orientation="vertical" >
<EditText
android:id="#+id/sidebar_title"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/shape_card_sidebar"
android:inputType="text"
android:rotation="-90"
android:text="I want to be like this" >
</EditText>
</FrameLayout>

You're going to run into several problems if you try to do it that way. The most obvious issue will be the incorrect measurement. Instead you should create a custom view. Something like this:
public class RotatedTextVew extends TextView {
public RotatedTextView(Context context) {
super(context);
}
public RotatedTextView(Context context, AttributeSet attrs) {
super(context, attrs)
}
public RotatedTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
// Switch dimensions
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
}
#Override
protected void onDraw(Canvas canvas) {
canvas.save();
canvas.rotate(90);
super.onDraw(canvas);
canvas.restore();
}
}
I haven't actually tested this, but this is how I'd start.

Replace your FrameLayout with <Relative> or <LinearLayout>. Also set android:gravity="center" property of parent layout.

Android: Video stretches on orientation change

I'm showing a video in a videoview:
In my XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:gravity="center"
android:layout_height="fill_parent">
<VideoView
android:layout_gravity="center"
android:id="#+id/videoview_player"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
It looked like this works perfect. The video resizes itself so the screen is filled, while the video remains it's aspect ratio.
But on tablets, after like 30 - 60 seconds in portrait orientation, the video stretches to full screen. (It doesn't maintain the aspect ratio, it stretches the height)
Like this:

I ended up subclassing the VideoView:
public class PlayerVideoView extends VideoView{
private int mForceHeight = 0;
private int mForceWidth = 0;
public PlayerVideoView(Context context) {
super(context);
}
public PlayerVideoView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public PlayerVideoView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public void setDimensions(int w, int h) {
this.mForceHeight = h;
this.mForceWidth = w;
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(mForceWidth, mForceHeight);
}
}
Where in the onCreate i set the dimensions
videoView.setDimensions(800, 600);
Then in the
#Override
public void onConfigurationChanged(Configuration newConfig) {..}
I manually set the dimensions for portrait or landscape, depending on the users device orientation.

The issue is solved just by removing the video view alignment from the parent and making it centre in the Relative layout.
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" >
<VideoView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:focusable="false"
android:focusableInTouchMode="false"
android:id="#+id/videoView" />
</RelativeLayout>

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

How to fill screen with rotated webview? - android

Related

ImageView onMeasure in a horizontal RecyclerView

Square layout on GridLayoutManager for RecyclerView

center children in a custom RelativeLayout

How to make the text in EditText vertically (Android)

Android: Video stretches on orientation change

Categories

Resources