Rotate ImageView source from layout xml file - android

I have this ImageView in my layout:
<ImageView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:contentDescription="#string/image_divider"
android:paddingBottom="8dp"
android:paddingTop="4dp"
android:scaleType="fitXY"
android:src="#android:drawable/divider_horizontal_textfield" />
It's a horizontal divider. I want to rotate it 90 degrees so I have a vertical divider.
Is there any possible way to do it right here from the layout and not the Activity class?

You can use Available Since API Level 11
android:rotation="90"
Final Code to Put,
<ImageView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:rotation="90"
android:contentDescription="#string/image_divider"
android:paddingBottom="8dp"
android:paddingTop="4dp"
android:scaleType="fitXY"
android:src="#android:drawable/divider_horizontal_textfield" />

Add "id" at ImageView (if not generate auto):
android:id="#+id/imageView"
and use the "id" (kotlin example):
val imageView = findViewById<ImageView>(R.id.imageView)
imageView.setRotation(90f) // rotate 90 degree

You can do that in your code by creating a new bitmap object.
Check this out : http://android-er.blogspot.fr/2010/07/rotate-bitmap-image-using-matrix.html
And specifically this function
Matrix matrix = new Matrix();
matrix.postScale(curScale, curScale);
matrix.postRotate(curRotate);
Bitmap resizedBitmap = Bitmap.createBitmap(bitmap, 0, 0, bmpWidth, bmpHeight, matrix, true);
myImageView.setImageBitmap(resizedBitmap);

Related

How to get Imageview location in android

I want to crop picture got from FrameLayout(#+id/previewFrame) as overlapped ImageView(#+id/guide_line_view) yellow guide line boundary.
I got ImageView location and cropped image what I got from previewFrame camera along the border of ImageView.
But imageview location is different from where it is visible, so cropped image not coincide with what I expect
ImageView(#+id/guide_line_view) is rectangle border xml like this
What's wrong with my crop. I searched stackoverflow, google 7 hours, but nothing helps.
#drawable/guide_line.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke
android:width="1dp"
android:color="#FFFF00"
android:dashGap="8dp"
android:dashWidth="30dp"/>
<corners android:radius="8dp" />
</shape>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
tools:context=".MainActivity"
android:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2">
<FrameLayout
android:id="#+id/previewFrame"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/guide_line_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="100dp"
android:background="#drawable/guide_line"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Bring Here"
android:textColor="#FFFF00"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/guide_line_view"
app:layout_constraintVertical_bias="0.207" />
</androidx.constraintlayout.widget.ConstraintLayout>
</FrameLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="#+id/take"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="takePicture"
tools:ignore="ButtonStyle" />
<Button
android:id="#+id/close"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="close"
tools:ignore="ButtonStyle" />
</LinearLayout>
</LinearLayout>
To get imageview location
below guide variable asserted as global int
And I calculate at onWindowFocusChanged.
guide_left = imageview.getLeft();
guide_top = imageview.getTop();
guide_width = imageview.getWidth();
guide_height = imageview.getHeight();
I've tried this as well. And so on.
int[] guide_location = new int[2];
imageview.getLocationOnScreen(guide_location);
int guide_left = guide_location[0];
int guide_top = guide_location[1];
crop bitmap
public void takePicture() {
cameraView.capture(new Camera.PictureCallback(){
public void onPictureTaken(byte[] data, Camera camera){
try {
Bitmap bitmap = BitmapFactory.decodeByteArray(data, 0, data.length);
Matrix matrix = new Matrix();
matrix.postRotate(90);
Bitmap r_bitmap = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(), bitmap.getHeight(), matrix, true);
// crop the image
Bitmap cropped_bitmap = Bitmap.createBitmap(r_bitmap, guide_left, guide_top, guide_width, guide_height);
I save cropped_bitmap and check it is correct, but not.
Supposed you take a picture in resolution 4096×2160 , and then set in previewFrame,
but if your device only have 1920x1080 resolution, the previewFrame only measure size in 1920x1080
As post you want to crop the specified rect from the orgin picture , you need to scale the crop ratio up
from 1920x1080 to 4096x2160
--- Try below ---
Bitmap bitmap = BitmapFactory.decodeByteArray(data, 0, data.length);
Matrix matrix = new Matrix();
matrix.postRotate(90);
Bitmap r_bitmap = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(), bitmap.getHeight(), matrix, true);
// scaled ratio
float ratio = 1f * bitmap.getWidth() / previewFrame.width;
// crop the image
Bitmap cropped_bitmap = Bitmap.createBitmap(r_bitmap,
(int) (guide_left * ratio),
(int) (guide_top * ratio),
(int) (guide_width * ratio),
(int) (guide_height * ratio));

Android app multiple imageviews to be loaded together

I have the following layout for an activity that displays 4 870x3700 jpeg images (each around 200KB):
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/scrollView2" >
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/testlay">
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:scaleType="centerInside"
android:id="#+id/imageView1"
android:contentDescription="#string/imageph" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:scaleType="centerInside"
android:id="#+id/imageView2"
android:contentDescription="#string/imageph" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:scaleType="centerInside"
android:id="#+id/imageView3"
android:contentDescription="#string/imageph" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:scaleType="centerInside"
android:id="#+id/imageView4"
android:contentDescription="#string/imageph" />
</LinearLayout>
</ScrollView>
</LinearLayout>
And the below code in my onCreate method:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Intent intent = getIntent();
message = intent.getStringExtra(MainActivity.EXTRA_MESSAGE);
setContentView(R.layout.test_pages);
ImageView imageView1 = (ImageView) findViewById(R.id.imageView1);
ImageView imageView2 = (ImageView) findViewById(R.id.imageView2);
ImageView imageView3 = (ImageView) findViewById(R.id.imageView3);
ImageView imageView4 = (ImageView) findViewById(R.id.imageView4);
imageView1.setImageResource(R.drawable.rsz_17_18_21);
imageView2.setImageResource(R.drawable.rsz_22_25_29);
imageView3.setImageResource(R.drawable.rsz_30_31_36);
imageView4.setImageResource(R.drawable.rsz_37_38);
Now on a tablet I'm able to display them with no problems but when I try to run the app on my mobile phone it throws an out of memory exception. I've tried several different resizing methods without any effect, even with a simple method to calculate the aspect ratio and return a height given the screen width.
How can I adjust the size of all the images in a way to avoid loading the original sized image into memory and make it scale down to the display screen's width while maintaining the aspect ratio?
try following
Calculate first the maximum possible inSampleSize that still yields an image larger than your target.
Second Load the image using BitmapFactory.decodeFile(file, options), passing inSampleSize as an option.
Third Resize to the desired dimensions using Bitmap.createScaledBitmap().
Hope this will help you.
Bitmap background = Bitmap.createBitmap((int)width, (int)height, Config.ARGB_8888);
float originalWidth = originalImage.getWidth(), originalHeight = originalImage.getHeight();
Canvas canvas = new Canvas(background);
float scale = width/originalWidth;
float xTranslation = 0.0f, yTranslation = (height - originalHeight * scale)/2.0f;
Matrix transformation = new Matrix();
transformation.postTranslate(xTranslation, yTranslation);
transformation.preScale(scale, scale);
Paint paint = new Paint();
paint.setFilterBitmap(true);
canvas.drawBitmap(originalImage, transformation, paint);
return background;

Unable to fill imageview by bitmap, weird behavior

Simple layout
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#0099cc"
tools:context="com.testzoom.app.FullscreenActivity">
<TextView android:id="#+id/fullscreen_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:keepScreenOn="true"
android:textColor="#33b5e5"
android:textStyle="bold"
android:textSize="50sp"
android:gravity="center"
android:text="#string/dummy_content" />
<Button android:id="#+id/dummy_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/dummy_button"
android:layout_gravity="bottom"
/>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:id="#+id/dummy_image"
/>
</FrameLayout>
Goal - by pressing button on the bottom, set imageview(which is same size as screen) with screenshot bitmap of half size. Result - weird rendering, why fitXY not working?
Click handler:
findViewById(R.id.dummy_button).setOnClickListener(new View.OnClickListener()
{
#Override
public void onClick(View v)
{
View view = getWindow().getDecorView();
Bitmap bmp = Bitmap.createBitmap(view.getWidth()/2, view.getHeight()/2, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(bmp);
c.scale(0.5f,0.5f, bmp.getWidth(), bmp.getHeight());
view.draw(c);
((ImageView)findViewById(R.id.dummy_image)).setImageBitmap(bmp);
}
});
Result on screenshots:
Note that this task is synthetic so don't ask why I am doing this, this is just demonstration of problem.
The problem lies within the call where you are scaling the canvas. You provide the pivot points which are bmp.getWidth() and bmp.getHeight() which are essentially in the middle of the screen.
findViewById(R.id.dummy_button).setOnClickListener(new View.OnClickListener()
{
#Override
public void onClick(View v)
{
View view = getWindow().getDecorView();
Bitmap bmp = Bitmap.createBitmap(view.getWidth()/2, view.getHeight()/2, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(bmp);
c.scale(0.5f,0.5f);//no pivot points
view.draw(c);
((ImageView)findViewById(R.id.dummy_image)).setImageBitmap(bmp);
}
});
I don't think it's the rendering so much as the placement of the new ImageView. You have all three items in a FrameLayout which does nothing to determine the order or placement of view. Where is the code to place the newly created ImageView?

Centerally aligned text over ImageView in android Linear Layout

How to display text on android ImageView with Linear Layout. I found many examples on stack overflow for this purpose but all are for Relative Layout, Frame Layout But I am not getting it in Linear Layout.
I have tried for android:text="My Text" But its not working.
Please suggest me if its possible to do so. If so how can it be done.
<ImageView
android:id="#+id/share_button"
android:layout_width="fill_parent"
android:layout_height="25dp"
android:layout_gravity="center"
android:layout_margin="5dp"
android:layout_weight="2"
android:text="text"
android:background="#drawable/iosbutton" />
This is the Image attached to this ImageView on which I want to display text in the center.
Try this
Use this method
public BitmapDrawable writeOnDrawable(int drawableId, String text){
Bitmap bm = BitmapFactory.decodeResource(getResources(), drawableId).copy(Bitmap.Config.ARGB_8888, true);
Paint paint = new Paint();
paint.setStyle(Style.FILL);
paint.setColor(Color.BLACK);
paint.setTextSize(20);
Canvas canvas = new Canvas(bm);
canvas.drawText(text, 0, bm.getHeight()/2, paint);
return new BitmapDrawable(bm);
}
call like this
ImageView image=(ImageView)findViewById(R.id.imageView1);
image.setImageDrawable(writeOnDrawable(R.drawable.ic_launcher,"Hello"));
Does it have to be an ImageView?
<TextView
android:id="#+id/share_button"
android:layout_width="fill_parent"
android:layout_height="25dp"
android:layout_gravity="center"
android:layout_margin="5dp"
android:layout_weight="2"
android:text="text"
android:gravity="center"
android:background="#drawable/iosbutton" />

Android low quality Bitmap from RelativeLayout View containing MapView

I am producing a Bitmap from a RelativeLayout that contains another Bitmap from a MapView set as the background plus two other views (icon & text) in the right hand corner. I'm getting the image I want but it is low quality. I've search high and low and found many pages on converting Views to Bitmaps but nothing regarding quality. I'm guessing it might be something to do with scaling.
The output image:
The code:
public Bitmap getBitmapFromMapView() {
// Get Bitmap from MapView
Bitmap mapBitmap = Bitmap.createBitmap(mMapView.getWidth(), mMapView.getHeight(), Bitmap.Config.ARGB_8888);
Canvas mapCanvas = new Canvas(mapBitmap);
mMapView.draw(mapCanvas);
// Inflate RelativeLayout view containing ImageView (FlagIt icon) and TextView (URL) in bottom-right corner
// and merge it with the MapView Bitmap to produce an Overall Bitmap containing everything
LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
RelativeLayout overallRelativeLayout = (RelativeLayout) inflater.inflate(R.layout.screenshot, null);
overallRelativeLayout.setBackgroundDrawable(new BitmapDrawable(mapBitmap));
overallRelativeLayout.measure(
MeasureSpec.makeMeasureSpec(mMapView.getWidth(), MeasureSpec.EXACTLY),
MeasureSpec.makeMeasureSpec(mMapView.getHeight(), MeasureSpec.EXACTLY));
overallRelativeLayout.layout(0, 0, overallRelativeLayout.getMeasuredWidth(), overallRelativeLayout.getMeasuredHeight());
Bitmap overallBitmap = Bitmap.createBitmap(mMapView.getWidth(), mMapView.getHeight(), Bitmap.Config.ARGB_8888);
Canvas overallCanvas = new Canvas(overallBitmap);
overallRelativeLayout.draw(overallCanvas);
return overallBitmap;
}
and the inflated screenshot.xml XML file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/screenshot_corner_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="4dip"
android:layout_marginRight="4dip"
android:shadowColor="#000000"
android:shadowDx="0.0"
android:shadowDy="0.0"
android:shadowRadius="4"
android:text="http://www.aroha.ws"
android:textColor="#ff0000"
android:textSize="18sp"
android:textStyle="bold" />
<ImageView
android:id="#+id/screenshot_corner_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#id/screenshot_corner_text"
android:layout_alignParentRight="true"
android:layout_marginBottom="4dip"
android:layout_marginRight="4dip"
android:src="#drawable/corner_title_icon" />
</RelativeLayout>
The RelativeLayout when displayed on my screen looks better quality:
output image desired quality http://5312208804164438257-a-1802744773732722657-s-sites.googlegroups.com/site/arohacorp/pilcrowpipeblog/device-2012-04-20-224931.png

Categories

Resources