Develop Reference

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));

Fit the size of the ImageView as well as perform rotation on it

My Activity
BitmapFactory.Options options = new BitmapFactory.Options();
Bitmap cameraBitmapNull = BitmapFactory.decodeByteArray(data, 0, data.length, options);
int wid = options.outWidth;
int hgt = options.outHeight;
Matrix nm = new Matrix();
Camera.Size cameraSize = camera.getParameters().getPictureSize();
float ratio = relativeLayout.getHeight() * 1f / cameraSize.height;
if (getResources().getConfiguration().orientation != Configuration.ORIENTATION_LANDSCAPE) {
nm.postRotate(90);
nm.postTranslate(hgt, 0);
wid = options.outHeight;
hgt = options.outWidth;
ratio = relativeLayout.getWidth() * 1f / cameraSize.height;
} else {
wid = options.outWidth;
hgt = options.outHeight;
ratio = relativeLayout.getHeight() * 1f / cameraSize.height;
}
float ratios = relativeLayout.getHeight() * 1f / cameraSize.height;
float[] f = new float[9];
matrix.getValues(f);
f[0] = f[0] / ratios;
f[4] = f[4] / ratios;
f[5] = f[5] / ratios;
f[2] = f[2] / ratios;
matrix.setValues(f);
Bitmap newBitmap = Bitmap.createBitmap(wid, hgt, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(newBitmap);
Bitmap cameraBitmap = BitmapFactory.decodeByteArray(data, 0, data.length, options);
imgfool.setImageBitmap(cameraBitmap);
canvas.drawBitmap(cameraBitmap, nm, null);
imgfool.setVisibility(View.VISIBLE);
//imgfool.setScaleType(ImageView.ScaleType.MATRIX); //required
// nm.postRotate((float)0);
// imgfool.setRotation((float) 90);
// Bitmap rotated = Bitmap.createBitmap(cameraBitmap, 0, 0, cameraBitmap.getWidth(), cameraBitmap.getHeight(), nm, true);
//imgfool.setRotation(90);
imgfool.setImageBitmap(cameraBitmap);
cameraSurfaceView.setVisibility(View.GONE);
takeScreenShot(oopss);
My XML
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="55dp"
android:id="#+id/frame"
>
<RelativeLayout
android:id="#+id/containerImg"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<SurfaceView
android:id="#+id/surfaceView"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/oopss">
<ImageView
android:id="#+id/imgfool"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:rotation="90"
android:scaleType="fitXY"
/>
<ImageView
android:id="#+id/logoImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:contentDescription="#string/app_name"
android:scaleType="matrix"
/>
</RelativeLayout>
<LinearLayout
android:id="#+id/redirect"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentStart="true"
android:layout_gravity="bottom"
android:layout_marginBottom="10dp"
android:background="#000"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:gravity="bottom"
android:orientation="horizontal"
android:visibility="gone">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="10dp"
android:layout_weight=".33"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:id="#+id/back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="#+id/label"
android:layout_gravity="center"
android:gravity="center"
android:src="#drawable/glow"
android:text="Back"
android:textColor="#fff"
android:textSize="20sp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</FrameLayout>
Here I have a imageview which do rotate to 90 degree but leave some space above and below eventhough i use match_parent and fitXY into my xml file.I searched a lot on this but did not found any appropriate solution of it.So please help me out with this. Actually the imageview here sets the bitmap image taken from surfaceview but When i set it on an imageview it gets rotated automatically.So I thought to rotate the ImageView to get the proper Image to be set on it.

How to make an Image button circular and inside the circle,an image will be shown and a border will be there around the image

I have been looking SO how to make an Image button circular and inside the circle, an image will be shown. But I could not find any helpful sources. I have only 24 hours and my client will check it.
My aim is to create Image Button(black colored circle, see the picture below and an image can be displayed inside it). See image below:
Here is my XML part...the ImageButton is between two comment lines
<LinearLayout 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="#drawable/backg"
android:orientation="vertical"
android:weightSum="10"
tools:context="sudhirpradhan.example.com.clientpptapp.mainIconFragment">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="0dp"
android:layout_weight="5" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="4.5">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<!--here is my imageButton need to be look like a circle and within that circle ,a picture will be shown .............. -->
<ImageButton
android:id="#+id/imageButton"
android:layout_width="0dp"
android:padding="10dp"
android:scaleType="fitCenter"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:layout_weight="3"
android:background="#drawable/roundbutton"
android:src="#drawable/frontbutton" />
<!-- ..........................................................-->
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="0dp"
android:layout_weight="0.5" />
</LinearLayout>
here is #drawable/roundbutton xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:startColor="#50d050"
android:endColor="#008000"
android:angle="270"/>
<stroke android:width="5px"
android:color="#000000"/>
</shape>
How can I implement that..any suggestion and thank you.

NEW EDITION
As per your comments I got a better idea of what you needed so I'll provide here (re-edited) the solution I have for you.
First I extended an ImageView like this:
public class CircleImageView extends AppCompatImageView {
private int borderColor;
private float borderWidth;
public CircleImageView(Context context) {
super(context);
}
public CircleImageView(Context context, AttributeSet attrs) {
super(context, attrs);
parseAttributes(attrs);
}
public CircleImageView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
parseAttributes(attrs);
}
#Override
protected void onDraw(Canvas canvas) {
Drawable drawable = getDrawable();
if (drawable == null) {
return;
}
if (getWidth() == 0 || getHeight() == 0) {
return;
}
Bitmap b = ((BitmapDrawable) drawable).getBitmap();
if(b == null || b.isRecycled())
return;
Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);
int w = getWidth(), h = getHeight();
int imgRadius = w - 2 * (int)this.borderWidth;
final Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setColor(this.borderColor);
canvas.drawCircle(this.getWidth() / 2,
this.getHeight() / 2,
this.getWidth() / 2, paint);
Bitmap roundBitmap = getRoundedCroppedBitmap(bitmap, imgRadius);
canvas.drawBitmap(roundBitmap, this.borderWidth, this.borderWidth, null);
}
public static Bitmap getRoundedCroppedBitmap(Bitmap bitmap, int radius) {
Bitmap finalBitmap;
if (bitmap.getWidth() != radius || bitmap.getHeight() != radius)
finalBitmap = Bitmap.createScaledBitmap(bitmap, radius, radius,
false);
else
finalBitmap = bitmap;
Bitmap output = Bitmap.createBitmap(finalBitmap.getWidth(),
finalBitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, finalBitmap.getWidth(),
finalBitmap.getHeight());
paint.setAntiAlias(true);
paint.setFilterBitmap(true);
paint.setDither(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(Color.parseColor("#BAB399"));
canvas.drawCircle(
finalBitmap.getWidth() / 2,
finalBitmap.getHeight() / 2,
finalBitmap.getWidth() / 2,
paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(finalBitmap, rect, rect, paint);
return output;
}
private void parseAttributes(AttributeSet attrs){
TypedArray ta = getContext().obtainStyledAttributes(attrs, R.styleable.CircleImageView);
this.borderColor = ta.getColor(R.styleable.CircleImageView_border_color, 0xffffff); // default color white
this.borderWidth = ta.getDimension(R.styleable.CircleImageView_border_width, 1.0f);
}
}
Then we need to set some styleable attributes for borderColor and borderWidth, place it in res/values/attrs.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="CircleImageView">
<attr name="border_color" format="color" />
<attr name="border_width" format="dimension" />
</declare-styleable>
</resources>
Then you can just include it in your layout - it will be like:
<LinearLayout 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:orientation="vertical"
android:weightSum="10"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="0dp"
android:layout_weight="5" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="4.5">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<!--here is my imageButton need to be look like a circle and within that circle ,a picture will be shown .............. -->
<com.mucodes.roundbuttonexample.CircleImageView
android:layout_width="200dp"
android:layout_height="200dp"
app:border_color="#ffff0000"
app:border_width="7dp"
android:src="#drawable/random"/>
<!-- ..........................................................-->
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="0dp"
android:layout_weight="0.5" />
</LinearLayout>
You can then use the method setOnClickListener to make the CircleImageView act like a button when clicked.
Here is a video of the result: example of using
Hope now this is what you need.

Sorry, can not comment due to a reputation.
Try to take a look at fancy buttons library.
Here you can set a radius to your button, background color, image and so on.
If you can not use third-party libraries - check library's source code, its pretty simple.

android - How to remove black field on Widget ImageView

Thanks for helping me to solve the problem.
I use setImageViewBitmap to widget imageview from a bitmap by drawing round corners with canvas, but it has a black field in imageview's corners. I don't know why this only happens on Widget but didn't happens on my Activity view.
How to let my corners on Widget look like corners on Activity?
here is my situation
on Widget :
http://goo.gl/YpzhJh
on Activity :
http://goo.gl/bc09oL
here is my code of making round corners.
public static Bitmap getRoundedCornerBitmap(Bitmap bitmap) {
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = 0xff424242;
//final int color = 0xff000000;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
final RectF rectF = new RectF(rect);
final float roundPx = 60;
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
return output;
}
here is the code of setting widget remoteviews
bitmap = getRoundedCornerBitmap(orgin_bitmap);
if(bitmap!=null)
views.setImageViewBitmap(R.id.main_imageview, bitmap);
here is widget xml :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/widget_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/main_imageview"
android:layout_width="600dp"
android:layout_height="600dp"
android:layout_centerInParent="true"
android:background="#color/transparent"
android:visibility="visible"
android:src="#drawable/widget_back3" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="600dp"
android:layout_height="600dp"
android:visibility="visible"
android:layout_centerInParent="true"
android:src="#drawable/widget_back2" />
<ImageView
android:id="#+id/imageView_redheart"
android:layout_width="600dp"
android:layout_height="600dp"
android:layout_centerInParent="true"
android:background="#color/blue"
android:visibility="visible"
android:src="#drawable/widget_back1" />
<TextView
android:id="#+id/now"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="#color/transparent"
android:fontFamily="sans-serif-condensed"
android:gravity="center"
android:shadowColor="#color/black"
android:shadowRadius="3.0"
android:text="9999"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/trans"
android:textSize="25sp"
android:textStyle="bold" />
</RelativeLayout>
</LinearLayout>

setbackground(null);
will help
in xml
android:background="#null"

My bitmap does not show all pixels

My problem is that, i can't view all the image or some pixels.
I have a imageview and bitmap on it. And with canvas library, I drawing the imageview limits. But the result is wrong. Why not sample the left and lower boundaries of the image? If I increase the brush size if it is.
Image : http://i.stack.imgur.com/R3Byw.jpg
I will show only the code of this part of my app
//Init imagebitmap
largeBitmap = Bitmap.createBitmap(200,200, Bitmap.Config.ARGB_8888);
//Init canvas
canvas = new Canvas(largeBitmap);
canvas.drawColor(0xffffffff);
//Set largeBitmap on Image
as.setImageBitmap(largeBitmap);
//Init Pincel
pincel1 = new Paint();
pincel1.setARGB(255, 0, 0, 0);
//Draw Limits
int ancho = canvas.getWidth();
int alto = canvas.getHeight();
canvas.drawLine(0, 0, ancho, 0, pincel1); // Superior
canvas.drawLine(0, alto, ancho, alto, pincel1); // Inferior
canvas.drawLine(0, 0, 0, alto, pincel1); // Izq
canvas.drawLine(ancho, 0, ancho, alto, pincel1); // Drch
xml
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/sv"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical|center_horizontal" >
<HorizontalScrollView
android:id="#+id/hsv"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical|center_horizontal" >
<LinearLayout
android:id="#+id/ll"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center_vertical|center_horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:contentDescription="#string/app_name"
android:scaleType="center"
tools:context=".SIDetailFragment" />
</LinearLayout>
</HorizontalScrollView>
</ScrollView>
I set scrollview only for test the bitmap image with scroll views on a easy form
Thanks in advance!

It's because you're going "too far". As with (almost) everything in programming, canvas indexes are 0 based. So you need to use ancho -1 and alto - 1.
canvas.drawLine(0, 0, ancho - 1, 0, pincel1); // Superior