I have a DialogFragment that creates an AlertDialog with a custom view in onCreateDialog. The custom view includes a spinning progress bar and a prompt as well as a large view (larger than screen dimensions) that is fit inside the custom content via scaleX and scaleY values.
I am using the PixelCopy API to copy only the large view into a bitmap. This works well, but with a rather annoying caveat:
I call PixelCopy as such:
val winloc = intArrayOf(0, 0)
view.getLocationOnScreen(winloc)
val offset = 0
val left = winloc[0] + offset
val top = winloc[1] + offset
val rect = Rect(left, top, left + view.measuredWidth, top + view.measuredHeight)
PixelCopy.request(getDialog().getWindow(), rect, bitmap, listener, view.handler)
The view.getLocationOnScreen(winloc) returns x and y coordinates of (84, 84)
When I check the generated bitmap, PixelCopy has captured a whole lot of frame, padding, shadows, and the actual view content (with a bit missing from bottom right). The part of the actual content that is missing is exactly the same amount as the frame, padding, and shadow that I get at the top left of the image.
Having tried anything else I could think of to get the correct bounds of this content I want to save, I started adding random values to the coordinates (the offset value above). On a Nexus 6P an offset of 112 was perfect. Now I can't just throw 112 in there without reason because 1. it's a magic number and 2. it only works on one device.
I have ran out of ideas as to how I can get the correct bounds for this view OR where I can find this 112 value so that I can properly offset what I have.
As the app is unreleased, I can't include actual screenshots, but here are some redacted screenshots (ignore the black bars).
Some notes about the screenshots:
The green part comes from dialog!!.window!!.setBackgroundDrawable(ColorDrawable(0xff00ff00.toInt())) so I could outline the window bounds. The transparent/shadow bit between the screen edges and the green rectangle ... is this a margin or padding?
The white rectangle with the red (content 1) and the blue (content 2) rectangles is the portion going to the bitmap
The red and the blue rectangles within the content are different views generated from the same data.
The blue portion contains a few SurfaceViews that I suspect I'd have to extract separately.
Device screenshot
Captured Bitmap (without the 112 magic number offset)
The solution so far has been to ditch the DialogFragment and use a regular Fragment. After inspecting the layouts, there were two paddings of 56 pixels, without any accessors to get their values. I suspect there's a bug somewhere in the private decor views that doesn't account for these paddings when calculating the location of the view in window.
I'll mark this as the answer until a better answer comes along.
Related
I'm trying to get the background color of image that I download with glide.
I think(please correct me if I'm wrong) that the best way is to get the edge pixel(top - left most, bottom - right most etc, my images are usually center image with solid background color)
I'm getting specific pixel color im my recycler view like this(based on the accepted answer here: How to Get Pixel Color in Android):
val bitmap = (binding.image.drawable as BitmapDrawable).bitmap
val pixel = bitmap.getPixel(x,y)
My question is how can I get the edge pixel of the image so I can determine the color of the background?
If you have the bitmap, you can use getWidth() and getHeight() (or just bitmap.width and bitmap.height in Kotlin) to get the X and Y coordinates of the far edges (it starts at 0 so it will be height - 1 etc).
Then you can plug those into getColor
with(bitmap) {
// origin (0,0) is the top left corner
val topLeft = getColor(0, 0)
val bottomRight = getColor(width-1, height-1)
....
}
(I used with to avoid going bitmap.whatever over and over)
This might not be the best way to get the actual background colour, it really depends (what if the image has a thin border?) and this could be a tricky problem! Just in case it helps, Android has the Palette library which lets you generate a bunch of colour swatches from a Bitmap, so that might be useful if you want to kind of pull out the main colours from an image and pick one
I have an array of strings and I have drawn those strings on screen using android graphics library (Canvas, Paint). Firstly, a transparent rectangle is drawn then on this rectangle I paint the strings, giving the impression of text with border line and filled.
The problem is some strings are long and some are short, how can I modify the rectangle so that it is as long and as wide as the string is? (Like WRAP_CONTENT in textView)
Currently I am using this method
canvas.drawRect(_x-10, _y-10, _x+620, _y+30, rectanglePaint);
canvas.drawText(placeName, _x, _y, textPaint); //text
If there is a better way then please do let me know.
Note: It will be used in an AR app so the text will be moving from left to right and vice versa as the mobile is moving. _x, _y for place name works perfectly in 2nd line, I want text should remain highlighted, no matter how the mobile is moving.
Paint has a measure text method that will give the width of the text if it were to be drawn with that paint. Its get font metrics will probably give you some data that you can calculate the height from. The sizing, positioning, wrapping and rendering of text is a very complicated problem and I would advise using a child TextView (with a background) in your ViewGroup rather than trying to roll your own if you're doing anything complicated.
I am using CCTMXTiledMap on cocos2dx-2.2, I created and added the tiled map like this:
// TileMap
CCTMXTiledMap *m_pTileMap = CCTMXTiledMap::create("tilesets/my-isometric-small.tmx");
float fPosX = m_pTileMap->getPositionX();
float fPosY = m_pTileMap->getPositionY();
CCLOG( "TileMapPos: %f, %f", fPosX, fPosY );
this->addChild(m_pTileMap);
The tiled map are created and rendered successfully, but out of position. I use CCTMXTiledMap::getPosition, CCTMXLayer::positionAt, and also examine the CCSprite that I get from CCTMXLayer::tileAt... all of them are returning the correct value based on cocos2d screen coordinate { (0, 0) from bottom left and increasing upward and rightward } However, when viewed on the screen, there is always a slight offset and I can't get where it come from. All the m_obOffsetPosition are confirmed to be zero...
By correct value, I mean the tiles are positioned in the pink area (I getPosition from each of the tile, create CCSprite for each, setPosition of each tile and add it to the screen... They show up in the pink area)
Image supposed to be positioned at shady pink boxes, but instead positioned in the blue area (the entire blue sea is the whole map)
Any ideas are highly appreciated... Thanks!!
After wasting days trying to dissect tilemap_parallax_nodes in cocos2d-x, finally I figured out the culprit... it is the Layer Property cc_vertexz that cause it to be rendered off position. I haven't got the time to figure out how and why it works that way and since I'm not going to use it anyway (I just need flat, single layer, thus no need z order etc), so I just remove that property from all of my Layers and the problem is gone..
Hope it helps someone... Thanks!
I want to create a semi doughnut shaped button which is only clickable in the region where it is visible and not in the the whole rectangular region.
http://i.stack.imgur.com/MKD45.png
I want clicking to affect only this blue region.
You can do this by grabbing the Bitmap representation of the Button, then testing the x/y pixel's alpha value.
To get the bitmap for a button:
Bitmap buttonBmp;
button.setDrawingCacheEnabled(true);
buttonBmp = Bitmap.createBitmap(button.getDrawingCache());
button.setDrawingCacheEnabled(false);
I'd recommend only doing this once, and saving the results, that way you're not creating a new bitmap every time you touch the button.
Then you override the Button's onTouchEvent so you have the local x/y where the user tapped. If the alpha in that spot is 0, you have a non-clickable area. It's not as simple as an onClickListener, but it should do the job.
This way you can use any arbitrary shape, not just a doughnut. Colors, textures, whatever.
I'm not entirely sure on this but I think this scheme would work. Create an image view in your layout to display the picture and make it clickable via an onTouchEvent. This way you can get the coordinates of the click. Check to make sure that the click is within the inner and outer radii and if it is, do the given response.
Here are a few calculations that will need:
Center of circle
-Assuming the center is the very bottom of the image, this will look something like this(not necessarily exact methods)
centerX = img.getX() + img.getWidth()/2;
centerY = img.getY() + img.getHeight()/2;
Remember that screen coordinates go from top to bottom and from left to right.
Find the distance away from the center where the click occurred
Dx = click.getX() - centerX;
Dy = click.getY() - centerY;
D = Math.sqrt(Dx^2 + Dy^2);
Then all you need is to check if the distance is within the radii(not sure how to get the exact radii here, may just need to guess and check. An alternative may be that the top of the semicircle is the top of the picture and then the max height with be the outer radius.)
if(D<=outerR && D>=innerR)
respond();
I need to apply click/touch events for only visible part of the View. Say for example a image of size 200X200. Apart from center 50X50, remaining part is transparent. I want to get touch events only for that 50X50 visible part Not on remaining transparent part.
In above image (its single image), only inner Diamond has got visible part. Apart from that Diamond is transparent area. So, if I touch Diamond then only I want to do something else ignore.
Edit :
Rachita's link helped me. I gone through that link and got idea how can I implement. But I could not understand some constants like 320, 240 etc while creating Points. In my case, I know the Diamond (in above image) x and y Ponits (hard coded values asctually). So, using those how can I determine, whether I touched inside Diamond or outside?
my Diamond points are as below
pointA = new Point(0, 183);
pointB = new Point(183, 0);
pointC = new Point(366, 183);
pointD = new Point(183, 366);
Edit :
Finally got solution from Luksprog. Its based on checking touched point pixel color. If color is 0 means, you touched transparent layer else you touched some colored part of the image. Simple, but very effective. Have a look at it here.
AFAIK you can not implement this with onclick listener or my any other direct way .You will have to use onTouchListener .
Firstly set your view dynamically at a specific (x,y) position using this How can I dynamically set the position of view in Android?
Calculate the region your diamond will occupy (you should khow the size of image inorder to calculate area of diamond)
3.Trigger a action in onTouchListener only when x, y fall in the required region. Use How to get the Touch position in android?
check this link to calculate if a given point lies in the required square
EDIT
To understand the coordinate system of android refer to this link How do android screen coordinates work?
Display mdisp = getWindowManager().getDefaultDisplay();
int maxX= mdisp.getWidth();
int maxY= mdisp.getHeight();
(x,y) :-
1) (0,0) is top left corner.
2) (maxX,0) is top right corner
3) (0,maxY) is bottom left corner
4) (maxX,maxY) is bottom right corner
here maxX and maxY are screen maximum height and width in pixels, which we have retrieved in above given code.
Remember if you want to support multiple devices with different screen sizes,make sure you use a relative value for x,y ie some ratio of screen height or width ,as different devices have different ppi
Check if touched point lies in the required polygon
I thinks these link might help you determining if the point touched (you can get x,y from onTouch event eg.event.getX()) lies in the required polygon whose points you have mentioned in the question . determine if a given point is inside the polygon and How can I determine whether a 2D Point is within a Polygon?