I am using two GLSUrfaceView to render video of my own camera and video i receive from server. They are video call data. One small and one large in size. The large GLSurfaceView has two mode, one is Normal Screen mode which is done by filling screen width and calculating the screen height as (DISPLAY_WIDTH * ASPECT_RATIO_OF_IMAGE), and the second mode is full screen mode which is done by filling screen height and calculating the screen width as (DISPLAY_HEIGHT * ASPECT_RATIO_OF_IMAGE). I make the screen large on double tap and again normal in double tap again. But the problem is in large mode the image is cut in the right side only. I want my image to be cut in all side fitting the FrameLayout center at GLSurfaceView center. I am adding my Code part also. See the below image also which describe my need.
<RelativeLayout
android:id="#+id/video_call_views_container_outgoing"
android:layout_width="match_parent"
android:visibility="gone"
android:layout_height="match_parent">
<FrameLayout
android:id="#+id/largeGLSurfaceViewContainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical"/>
<FrameLayout
android:id="#+id/smallGLSurfaceViewContainer"
android:layout_width="120dp"
android:layout_height="170dp"
android:orientation="vertical"
android:visibility="gone"/>
</RelativeLayout>
Here is my coding part :
GLSurfaceView frontCameraGLView = new GLSurfaceView (this);
GLSurfaceView opponentCameraGLView = new GLSurfaceView (this);
largeVideoRenderLayoutOutgoing.addView(opponentCameraGLView );
largeVideoRenderLayoutOutgoing.setOnClickListener(this);
opponentCameraGLView.setZOrderMediaOverlay(false);
smallVideoRenderLayoutOutgoing.addView(frontCameraGLView );
smallVideoRenderLayoutOutgoing.setOnClickListener(this);
largeVideoRenderLayoutOutgoing is the reference of FrameLayout having id largeGLSurfaceViewContainer , smallVideoRenderLayoutOutgoing also refer FrameLayout having id of smallGLSurfaceViewContainer. GLSurfaceView are added to FrameLayout's during onCreate of Activity. The problem is specified in the below image's
This image is image in the Upeer side is in Normal Mode. And the Below image is in Full Screen Mode. See the left side of these image. They are same but the right is cut in FullScreen mode i mean the last image. I wish that the image should be center fitted so that the image is cut in all side focusing my incoming video's center
If a GLSurfaceView's width is or height is larger than the device screen, it will behave like below:
1. For width larger than device width but height is same as device height: the GLSurfaceView will start drawing from top left corner which co-ordinate will be (0,0) and the extra image will be out of screen right side. So the image center will not be in layout's center. To solve this problem we need to shift image left as leftMargin which value will be half of (imageWidth-deviceWidth). The code's are like
ViewGroup.MarginLayoutParams marginLayoutParams = (ViewGroup.MarginLayoutParams) glSurfaceView.getLayoutParams();
int margin = (-1 * (int) ((glSurfaceView.getWidth() - displayWidth) / 2));
marginLayoutParams.setMargins(margin, 0, 0, 0);
setLayoutParams(marginLayoutParams);
Please do write a similar code if the heigh of the glsurfaceview is larger than device height. Add a margin on top so that the image is fitted in center of the device
Related
I want to rotate my image view 45 degree from its bottom right corner please suggest me how to do that
I am trying to add rotation in imageview like this
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/poker_table"
android:scaleType="fitXY"
android:id="#+id/poker_table"
android:rotation="45" //this line I added
/>
but the above code rotating my image from its center point. So please suggest any solution to rotate image from bottom right corner.
If you know the size of the View, you can use a pair of xml atttributes to set a pivot point for rotating or scaling a View: android:transformPivotX and android:transformPivotY
If we assume the View has a size of 100dp x 100dp:
android:transformPivotX="100dp"
android:transformPivotY="100dp"
Other possible units are sp, px, in, mm... but unfortunately match_parent will not work, and neither will 100%.
If you don't know the size of the View at compile time, your only option is to set the pivot point programmatically (using setPivotX() and setPivotY()) after determining its actual size.
I have an image that I want to use as a background for an activity.
I would like to take the screens height and width from the top right hand corner of the image. For example in the image below a screen the size of the red square would display that portion of the image, where as a blue screen would display everything in the blue square.
This is similar to a background image in html with the parameters 'cover' and 'top right corner fixed'.
I would recommend using android:layout_width="1900dip" and android:layout_height="951dip" and removing some of the extra but not really import attributes you have. Dip is a better solution than dp for image sizes across android devices(since their screen sizes are all different).
For the blue screen image have its height and width match the parent which would be the relative layout which will allow for it to fill the whole page. Then the red image will overlap from the top right.
<ImageView
android:id="#+id/imageView1"
android:layout_width="1900dip"
android:layout_height="951dip"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:src="#drawable/bgnd"
/>
I have an image like this used as background in a RelativeLayout:
This image is used as background for all the levels of my game. Every level is drawn onto the blue area.
I want to keep fixed the aspect-ratio of the blue area, changing the size of the red edges to avoid to show to the user unused pixels of their screen. The green area must be fixed to 80dp for all phones. Then I must add a View (a GLSurfaceView) in my layout in such a way that it fit perfectly the blue area. Thus all levels of my Android game will be perfectly the same in all Android device.
How can I solve this problem?
The real image that I use is a little more complex. You can look it here:
Real image
I would use a FrameLayout for the middle part of the screen(blue), add an ImageView, containing the BackgroundImage you want to display, and put the GLSurfaceView on top of it.
Since the aspect ratio is always the same, you could set the ImageViews sclaing to fit xy and the image should always look the same.
Lets assume you are using a simple SurfaceView, the xml code id use to put a ImageView begind it would look like this
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:layout_height="match_parent"
android:layout_width="match_parent"/>
<SurfaceView
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
As i dont know how you build your View i cant post the code that does the job, but just add a FrameLayout instead of your GLSurfaceView to your View, with the Same Dimensions, the GLSurfaceView would have.
To that FrameLayout first add the ImageView, then the GLSurfaceView. Both with height and width set to match_parent.
To Figure out the size of your SurfaceView...
Retrieve Display Dimensions
Substract Green Bar Dimensions
Calculate the size of the Blue View, get the Height/Width (whatever is bigger) calculate the missing Dimension
Set the Red Views to Occupie the empty space.
So you would have to do this programmatically :)
My Android app is for Gingerbread and above. It creates screen output of a graph and a text table. Each is square in shape and drawn using an imageview. These are placed with the layout xml separately within a linear layout. I want the squares the same size and as large as possible. In portrait mode they are stacked and in landscape mode they are side by side. There is nothing else drawn by the app.
I use this code to get a notion of what size squares to draw:
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
height = metrics.heightPixels;
width = metrics.widthPixels;
....
landscape=width>height;
//use fudge factor for vertical display (account for title bar, etc.)
if (!landscape)
graphSize=(int) (0.9f*(float)height/2.0f);//reduce by 10%
if (landscape)
graphSize=width/2;
I use graphSize to set the size of the imageviews for output.
Recognizing that the width and height provided by the metrics only gives an approximation (for numerous reasons I do not wish to get into), I simply reduce the height by a fudge factor when sizing my squares. In landscape mode using width over 2 as the square size gives a good display which makes fairly good use of the available screen space. In portrait mode using height/2 works poorly: the second drawn square is diminished in size. So I reduce the height by 10% then divide by two to get the square size. This works but does not make good use of the available space. Any suggestions?
Might be you want something like this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2">
<ImageView
.
.
.
android:layout_weight="1" />
<ImageView
.
.
.
android:layout_weight="1" />
</LinearLayout>
I have a normal "read an article" type page with a single large photo at the top.
I'd like it to:
not scale larger than the source imgae
not be larger than the screen
not be CRAZY long vertically
side things I already have working
border (via padding), center crop (would rather top crop, but seems not avail)
The main issue I'm having is - I can either have it fill_parent (ie full width) OR wrap_content (ie as large as the original image). And nothing I have done so far allows the image to be normal size (ie keep from enlarging).
Is there a "norm" for this kind of thing? I'm sure there's some kind of sweet spot or combination of attributes for this that works - I just can't find them.
My current attempt:
<ImageView
android:id="#+id/article_photo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/super_light_gray"
android:scaleType="centerCrop"
android:contentDescription="#string/articlePhoto"
android:cropToPadding="true"
android:layout_marginBottom="20dp"
android:padding="1dp"/>
You can write some code in the Activity to get the image size and display size.
If the image size exceeds display size set width to display, if not set to image size. If you want to be fancy you can find the ratio between the x and y and scale vertically also.