Colour Name From RGB values - Android Q&A, Help & Troubleshooting

Hey Guys,
Im a final year software engineering student at staffordshire university. For my final project im making a colour identification android application for colour blinded people. Till now I know how to get the RGBA values from a particular pixel area. But guys how can i convert those values in to certain colour name so i can give it back to the user in voice+text. Please help.. im kinda stuck in getting the colour name from the RGB values
thanks

Hi, I'm not aware of any lib that will convert RGB to text, but you can build your own ! First of all, you must pick up a color 'threshold'. RGBs goes 0-255,0-255,0-255 so there are 256^3 possible colors to map... hmmm I think too many
What if we approx the colors dividing each 256 in a 4 group (threshold = 85) ? We would then have just 64 colors to map (4^3) that would be much easier to manually map the colors to names .
Then take your RGB value and approximate it to the upper (or lower) class and check it against your brand new array composed by RGB approxed values, and extraxt its name
ex.
Code:
0-0-0 = Black
0-0-85 = Very dark blue
0-0-170 = Dark blue
0-0-255 = Blue
0-85-0 = Rotten Green
0-85-85 = Water
0-85-170 = Poisoned water
0-85-255 = Azure
0-170-0 = Light green
0-170-85 = colorName
0-170-170 = colorName
0-170-255 = colorName
0-255-0 = colorName
0-255-85 = colorName
0-255-170 = colorName
0-255-255 = colorName
85-0-0 = colorName
I made you this PHP script that might help you in choosing the correct threshold (that will affect the overall accuracy of your color recognition) and give a name to the color. Just change the $th = value .
PHP:
<?php
// Color threshold
$th = 85;
$count = 0;
for ($i=0; $i<=255; $i= $i+$th) {
for ($j=0; $j<=255; $j= $j+$th) {
for ($k=0; $k<=255; $k= $k+$th) {
echo $i . '-' . $j . '-' . $k . '</br>';
echo '<div style="width:50px; height:50px; background:rgb('.$i.','.$j.','.$k.');"></div>';
$count++;
}
}
}
echo "Total colors: ".$count;
?>
Good luck, if you got lost in my words, feel free to ask me for light !

Questions or Problems Should Not Be Posted in the Development Forum
Please Post in the Correct Forums
Moving to Q&A

lufc said:
Questions or Problems Should Not Be Posted in the Development Forum
Please Post in the Correct Forums
Moving to Q&A
Click to expand...
Click to collapse
Isn't the development section for asking development related questions? Who trawls the Q&A section for development help? I certainly wont go looking there for development related material since the section this was posted in clearly says "Development". Worldwide, Q&A != R&D, Q&A = "eh? where does my battery plug in?"
To answer the question, I found this little gem: Set RGB color codes for android and RGB color look up table
The easiest way would be to use a table like that the as some sort of look up table. Try and mirror .net's Color.GetKnownColor(int r,int g, int b) method. Browse around the mono code for an idea how how you can implement this. Read the pixel, then try and match the rgb values with your table. Good luck

Aww thanks <3 hey you have any idea about colour tracking also in android

princessDroid3 said:
Aww thanks <3 hey you have any idea about colour tracking also in android
Click to expand...
Click to collapse
You mean something like this blob tracker?

ell3 said:
You mean something like this blob tracker?
Click to expand...
Click to collapse
well can I change the blob to detect only squares

Related

[Q] App assistance if possible -

ImageView imageview = (ImageView)findViewById(R.id.image1);
imageview.setImageResource(imageIDs[position]);
String imageUrl = "file:///local/dir/page_1"; // http://example.com/image.jpg
WebView wv = (WebView) findViewById(R.id.yourwebview);
wv.getSettings().setBuiltInZoomControls(true);
wv.loadUrl(imageUrl);
That's part of my code.....
when i run this, on the emulator, the app runs but when i click on the icon to view the image via webview. it force closes. what am i doing not correctly.
Connect the debugger to your phone and look at where it is crashing. The clues you get there are (almost) priceless.
Sent from a distant planet with the aid of my towel.
Check manifest for all class , may be.
______________________________________
Sent from Xperia Arc
~Running DooMKernel[Rev : v10][FW:4.0.A.2.368]
~Dont forget to say thanks.Just click on the lower right corner thanks button.
Logcat is your friend.
Put display statements in your program too; they show up in logcat, for example:
System.out.println("I am here 1");
System.out.println("I am here 2");
And it's a good idea to test validity of views:
if(imageview != null) {
// TO DO...
}
Questions or Problems Should Not Be Posted in the Development Forum
Please Post in the Correct Forums
Moving to Q&A

OpenGL 2.0 shader not working on Galaxy S2

I've done a lot of coding of shader with GL and DX over the years so I thought I'll knock up a simple rotating cube on my phone. For me this really is a 10 minute job. 2 hours later I was stumped..........
The shader is just a transforms of the xyz and copy of the vertex colour. This works fine with one matrix. When I separated the model matrix out so now I upload a view*invcam matrix and a model matrix it all failed. After some hacking about I got to a point where just adding the one extra mat4 uniform stopped the shader from working. Feels like a bug in the OS, anyone know of Samsung GLES 2.0 shader bugs? I'm at work at the moment but later I'll post the shader. It really is "my first shader" simple stuff.
Here is my pixel and vertex shaders, very simple.
If I uncomment out the line "uniform mat4 trans;" the shader stops working.
Code:
precision highp float;
uniform mat4 proj_cam; //This is the projection * invcam matrix.
//uniform mat4 trans; //This is model to world space.
attribute vec4 vPosition;
attribute vec4 vColour;
varying vec4 v_colour; //The colour that is passed to the pixel shader.
void main()
{
gl_Position = proj_cam * vPosition;
v_colour = vColour;
}
Code:
precision mediump float;
varying vec4 v_colour; //The colour that is passed to the pixel shader.
void main()
{
gl_FragColor = v_colour;
}
So if I change the shader to use an array of matrices and upload the two matrices from one float[32] array it works...
Code:
precision highp float;
uniform mat4 proj_cam[2];
attribute vec4 vPosition;
attribute vec4 vColour;
varying vec4 v_colour;
void main()
{
gl_Position = proj_cam[0] * (proj_cam[1] * vPosition);
v_colour = vColour;
}
I smell an OS bug............
Questions or Problems Should Not Be Posted in the Development Forum
Please Post in the Correct Forums
Moving to Q&A
Sorry, I don't understand. This is a software development question, why move to the Q&A thread? Did I not post it in the software development forum?????
Just rewrote my test application in c/c++ (I think that is software development? ) with the NDK and it works so Samsung must have broken the GL2 mapping to the native code side in their version of the API.
I don't really need to work in c/c++ so thought using Java would allow rapid prototyping. Guess not seeing it's broken...........

Development question

Hey all,
I have a quick development question. I have an application that displays an image. You can pinch zoom/move the image around easy enough. What I'm wondering is how would I go about mapping the location of the users touch to the coordinates on the image itself, and not the screen?
Thanks
dekoy316 said:
Hey all,
I have a quick development question. I have an application that displays an image. You can pinch zoom/move the image around easy enough. What I'm wondering is how would I go about mapping the location of the users touch to the coordinates on the image itself, and not the screen?
Thanks
Click to expand...
Click to collapse
It cm7 there is a dev tool that let's you map the coordinates of where your touching the screen. I'm not sure if this is what you want though...
Sent from my GT-I9100 using xda premium
dekoy316 said:
Hey all,
I have a quick development question. I have an application that displays an image. You can pinch zoom/move the image around easy enough. What I'm wondering is how would I go about mapping the location of the users touch to the coordinates on the image itself, and not the screen?
Thanks
Click to expand...
Click to collapse
Let' say your image is 1024x768 and your screen is 800x600.
Your scale rate is Min(1024/800;768/600) = 1.28
If your touch event was at x: 200 y: 300 (screen coords), the coords at the image are {x:200*1.28;y:300*1.28} = {x:256;y:384}
So, code-wise, you should use
public boolean onTouchEvent(MotionEvent event) {
int xPos, yPos;
if (event.getAction() == MotionEvent.ACTION_DOWN) {
xPos = (int) event.getX();
yPos = (int) event.getY();
}
}
Then scale it with cGollner's method.

[TIP][Guide]Change Default Home Button Color

Hi Guys.. I've been searching for ways to change the default color of Home Button of our Ray. Been on decompiling/compiling framework, settings... but got nothing or don't know exactly what xml/smali that controls the color of the buttons. So, by doing some trials-and-errors...:crying: Maybe this time I hit it.
First of all I want to thank:
JJDOCTOR for giving the hint to enable the light of Home button.
boy*racer*- max echo value is 20000
and all of you GUYS here on xda..
So here it is, navigate to system/etc/pre_hw_config.sh using ROOT EXplorer and find these lines:
echo 1000 > $dev/red/max_current
echo 1000 > $dev/green/max_current
echo 1000 > $dev/blue/max_current
and change to anything you want, I made it to
echo 1000 > $dev/red/max_current
echo 2000 > $dev/green/max_current
echo 9000 > $dev/blue/max_current
THE HIGHER THE VALUE, THE BRIGHTER THE LED.
Save changes....
For color preferences calculations: Go here. Thanks to Xtremy.
The above is nearly ICS Blue... You can put any values you want til 20000(?) except ZERO (0). By putting zero, that color will not be used by the system notifications ( I think)...
THIS WOULD NOT MAKE ALL OF THE NOTIFICATIONS COLOR TO THE COLOR YOU HAVE SET, ONLY THE DEFAULT HOME BUTTON COLOR IS AFFECTED. Sorry if the first flash of notification is not the COLOR you desired, only the succeeding flashes... I'm not a developer, I don't know how to do this correctly.
I THINK THIS WOULD NOT WORK ON CM-BASED ROM, BECAUSE THE HOME BUTTON LIGHT IS DISABLED (automaticbrightness is already set to FALSE). If somebody can make it to work, just apply it.
SOME DEFAULT COLOR WOULD NOT BE THE CORRECT APPEARANCE AFTER CHANGING THOSE LINES.. example, Violet is not violet when you use it as message notifications, still ICS Blue(?). Just raise the values.
REBOOT IS A MUST... Hope it won't bootloop...
adulfo said:
......................but got nothing or don't know exactly what xml/smali that controls the color of the buttons..........................:
Click to expand...
Click to collapse
XML is used to create user interface and the components used in app and java is used to create executable codes that will make apps functionality.
XML and smali are created automatically in app development.Though notepad++ is best to type XML.Best and easiest way to create a xml file is just write code in notepad++ and save it with extension of .xml.If you are developing an application of android then xmls are created by software itself. You will just need to specify name and add it to project as xml file...
thank you! i was just looking for this:good:
This is a nice mod adulfo! :good:
I wrote a little tutorial for finding your color value:
Go to this Color Wizard website.
Choose the color of your choice in de color bars.
In the #box you find the hex value for your color.
For this tut i use a nice orange E45F13 hex value.
Split de value in three pieces E4 5F 13.
1st byte E4 xx xx is for the Red value. (#FF0000)
2nd byte xx 5F xx is for the Green value. (#00FF00)
3rd byte xx xx 13 is for the Blue value. (#0000FF)
Open windows calculator set it in Scientific Mode.
1) Hit F5 to select HEX.
2) Type in your first hex (if HEX is 00, decimal is 0)
3) Hit F6 to convert to decimal.
Do this for all three hex values and write down the numbers...
1st byte E4 xx xx E4=228
2nd byte xx 5F xx 5F=95
3rd byte xx xx 13 13=19
As we know "max echo value is 20000" or 255 so:
20000 / 255 X 228 (your 1st above number)= 17882 for the Red Value
20000 / 255 X 95 (your 2nd above number)= 7450 for the Green Value
20000 / 255 X 19 (your 3rd above number)= 1490 for the Blue Value
Change the values in system/etc/pre_hw_config.sh for red, green and blue save & exit, reboot!
---------- Post added at 12:48 AM ---------- Previous post was at 12:37 AM ----------
I use the Tron Legacy Cyan color: 00DFFC
1000 for the Red Value.
17490 for the Green Value.
19764 for the Blue Value.
also note:
I set the first byte for Red to zero
after reboot it went to 1000 value,
so I think 1000 is the lowest value.
Thanks mate.. To those also having problems converting those values, you can google HEX to RBG converter.
wow it is very great and i change it
works perfect
4.0.4 587
psp1987 said:
wow it is very great and i change it
works perfect
4.0.4 587
Click to expand...
Click to collapse
Would be nice if you will read my signature...
what does this change ? the light shown when the phone is switched on and had no notification ?
-Jesco- said:
what does this change ? the light shown when the phone is switched on and had no notification ?
Click to expand...
Click to collapse
This would only change the default color of your Home button ( if only it is enabled), hitting any of your physical keys.
i changed all the values to 10000, all the colors are the same but a lot brighter, default 1000 is too dim for me.
@adulfo thanks for the tip buddy, can happily report that it is also working on my ray
Sent from my ST18i using xda premium
This values as depicted on the lines itself maybe clear, raising it, means raising LED current, more current more power,more power so much brighter... If you want color other than WHITE, don't make the values nearly equal.
Xtremy said:
also note:
I set the first byte for Red to zero
after reboot it went to 1000 value,
so I think 1000 is the lowest value.
Click to expand...
Click to collapse
Zero doesn't work, i try 0001, it works.
for RED color, the value is 10000,0001,0001.
Try again to see the values on your pre_hw_config.sh if it did not changed after reboot. Then all of your notifications will turn to RED.. By setting the lowest value to 1000, still the GB colors has still a good current value.
Flashable zip for Holo style Blue
Not made by me but jjdoctor...
had this zip tho
lokenok said:
Flashable zip for Holo style Blue
Not made by me but jjdoctor...
had this zip tho
Click to expand...
Click to collapse
I think this will make all of your notifications to LIGHT BLUE?.. Correct me if I'm wrong... Doing that also.. Better to put those values on pre_hw_config.sh..
adulfo said:
Try again to see the values on your pre_hw_config.sh if it did not changed after reboot. Then all of your notifications will turn to RED.. By setting the lowest value to 1000, still the GB colors has still a good current value.
Click to expand...
Click to collapse
so is there any value that change the LED to RED but not affect to other notification color???
luckkonku said:
so is there any value that change the LED to RED but not affect to other notification color???
Click to expand...
Click to collapse
Just don't put those values on hw_config.sh, only on pre_hw_config.sh I think....
hi guys this is my first comment so, i've changed these values in pre_hw_config.sh and of course i've got the color i want (nearly ICS blue). BUT here is my problem: other notifications like charging (instead of red it's nearly pink, instead of orange it's nearly green...) not working properly. I'm using light flow led and its notifications also miss the right color. Is there a solution for this? I'm not a developer but i think the phone calculates the values of notifications by this three values and must be an algorithm for this somewhere in the phone, so maybe we can manipulate that. Tell me if I'm wrong. Sorry for my english it's not my native language.
bobo023 said:
hi guys this is my first comment so, i've changed these values in pre_hw_config.sh and of course i've got the color i want (nearly ICS blue). BUT here is my problem: other notifications like charging (instead of red it's nearly pink, instead of orange it's nearly green...) not working properly. I'm using light flow led and its notifications also miss the right color. Is there a solution for this? I'm not a developer but i think the phone calculates the values of notifications by this three values and must be an algorithm for this somewhere in the phone, so maybe we can manipulate that. Tell me if I'm wrong. Sorry for my english it's not my native language.
Click to expand...
Click to collapse
Try to raise the values of the other color, I stated that on my OP last part that if you make the other values extremes (1000 and 20000), the the colors will be affected.. If for instance, Blue will have 20000 value, the notifications color that contains blue (violet...) will have dominant blue and other colors will be suppressed, so VIOLET will turn out to be more on BLUE.

SDK or NDK w/o OpenGL in app to save battery?

I would like to develop and app, which has the main functionality to show a 2D chart. There are others and settings, but this is the main.
Existing similar applications aren't using technologies as how it should and they are releasing apps with to few features or they are draining battery like crazy. This I would like to improve it.
This is for web / desktop
View attachment 2397770
Here are a few sentences from my experience, please correct me if I am wrong!
Many-many of implementations are using SDK and 2D graphics. They draw the whole screen every time. Just sere how your battery drained in 1-2 hours! - some really bad implementation they can drain in 3 minutes, I will show later. One exception is: Metatrader 4: it use NDK and OpenGL, Hey pay me, because I am advertising you!
I think the SDK code (.class files) it need to e compiled at runtime execution by virtual machine, which takes CPU usage.
NDK is compiled only one => will use less CPU => will drain less batter as the SDK version.
If this is correct, than it should move more code to NDK if is possible. Not sure about JNI calls overhead!
NDK huuuuge advantage: it will allow to use the phone max available memory ( 1.5GB was last time) instead of SDK max allowed value: 256MB ( in my case, but some devices allow only 24Mb for SDK apps)
If you don't touch this chart than nothing changes, if you set the "Live" option, than the last "candle" will change. The candles are those Red & Green rectangles with the line in upper side and down side with meaning of the open, high, low, close prices. - it is related to business logic, but this special bars can have those 2 lines, which are important. The border of the 1pixel black around the red-green rectangles are for visual effects only. To save battery can be omitted.
(The background text and logos are just for advertisements, nobody cares, not really needed for the user for his actions)
As you can see there is a toolbar, and there are maybe other components too, but when the user want to see highest amount of data than will rotate to landscape and there should be given a Full Screen (in portrait not by default)
I have started the development with a component for rendering with OpenGL ES 2.0.
The UI is in SDK , the renderer there is called, but the method implementation calls the native methods via JNI. The business logic, rendering implementation are all in NDK, which is a native shared library.
Not sure why I started with OpenGL, to have some cool effects, who want to drain his battery faster? or I tough if is faster than will consume less battery? - maybe faster drains, but more: 100 mA from GPU for 0.01 seconds rendering is the same as 10 mA for 0.1 rendering at CPU.
Here I am not sure if I am saving energy. Tell me your opinion!
So I have started learning OpenGL ES 2.0 and all what I saw in tutorials it was triangle triangle triangle, but in this chart there is no triangle, but rectangle, or rectangle+lines or just lines with set width or many triangles?
Here is a cool candle, I would like to see this, but I know the gradients will burn battery.
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Here is a bit magnified and you can see how I am thinking:
but can't decide. Because I haven't enough experience, don't know the benchmark results. I would like to see a tear down and expected results:
GL_Lines + glLineWidth
GL_triangles
GL_triangle_strip
As the first option with GL_lines:
A candle would be 1x small line from the Low and High price drawn first. Lets say with 5 pixel width to have room for gradient too, if needed. In worse case only 1 pixel, as how they are using others now.
The candle body: the red/green rectangle with has the info of Open/Close price can be another GL_Lines with 50 pixel width - for example.
Will be gradient or not that would depends on user settings. Not sure how is possible to draw black 1-2 pixel of border for candle body in this case - if the user has that settings.
Seconds option with triangles:
2x triangle can make a square.
There is a square as the small line and there is another one the larger square : the candle body.
The triangle strip case:
if only one GL_triangle_strip:
bottomline: 4 vertices
body other 4
upper line 4 vertices
or small line 4x vertices
+
other 4x vertices , so 2x GL_triangle_strip
I made this:
The first thing it was:
Code:
setRenderMode(GLSurfaceView.RENDERMODE_WHEN_DIRTY)
It is a rectangle with 2x triangle and a line with width.
The line has less vertices of course, but in this chart is expected to have 50- 200 bars maximum. Minimum 10-20.
What is needed is that cross at mouse location: that dashed line and the numbers ( price ) on the right and some other texts in bottom. X, Y coordinates in text.
Please post your experience, benchmarks, opinion.
Hi matheszabi,
ok, your question was rather compheresive . So right way to find solution is rather complicated too.
I woudn't choose solution according to differences between JDK / NDK to same function calls of OpenGL ES 2.0
According to my experience, performance (and power consumption) is almost the same.
GLOBAL aproach: I suggest
1) you create your application in Java - use JDK versions - creating native function for just few draw calls is, imho, hard compared what you get
2) if your application is NativeActivity
- use direct calls - be prepared for differences between devices, proper creation of surface, .... but it's faster
- subclass Native Activity and use JAVA as well
3) not using OpenGL ES directly at all - i suggest trying layout and buttons / images inside of it, i saw 200 control buttons on 1 screen and it ran perfectly. And layout is movable by 1 command - offset. I suppose, this is completely written in native code anyway. You just get drawing interface in JAVA.
Now, to OPENGL ES itself (JAVA or NDK)
cons:
- OPENGL is 3D interface so pixel perfect drawing is something which is not supported by itself. (note: opengl has pixel / texel center at 0.5 not at 0.0/1.0)
- you need pixel perfect draw - boxes you draw must be perfectly aligned to screen pixels - othewise you get blurry results
- you might not need texturing - thats PLUS, otherwise drawing pixel perfect opengl suraces is "pain in the ..." - viz. texel interpolation and drawing a pixel checker aligned with screen pixels is real nightmare and it differs on each device (I tried )
- pixel perfect with mipmaps - awful again
- alpha blending (when you have something which is transparent) - you will need sorting to draw it properly
- will you need font ? oh my ...
- NO EMULATOR - will need to test each device if it's working properly (not every, at least each vendor)
to consider:
writing vertex/fragment shader in a world with 3500 (number of opengles 2.0 devices according google) suitable devices/compilers/android versions ... ehm
pluses:
- you draw exactly what you want
- use of fragment shader (alhough i suggest using gradient textures instead)
- i suggest draw primitives in vertex buffers (indexed triangles or triangle strips). Not one box by one - compose all in one array and draw it by one draw call. Doubling points in strips can help you
- instancing is not supported) but there is way surpassing this (preparing buffers with)
- i don't recommend using lines with width definition - each implementation draws this differently - and it's equal to drawing lit cylinder
- in native activity loop - handling if you need redraw - it's difficult
I would try normal android GUI first
pluses:
- you get pixel perfect draw, with / without bitmaps, images, gradients ....
- i suppose its fast enough
- no sorting needed
- redraws will be invoked when something changes
- translation / clipping will be handled internally
- no need to care about device !!! that's big plus
cons:
- zoom will be problematic
- rotations as well (but i suppose you don't need them)
note to power consupmption - both OpenGL :
just swaping screen buffers 30 per sec will deplete most of devices within 2-3 hours. But of course, doing it so only when needed is doable
But I might be wrong so best way is to decide by yourself and, of course, try it and see.
If you have qustions about drawing through ES, i'll post some samples of pixel perfect draw (from my gui)
Good luck, post your decision, and if you have some results, post them too! will be very interesting.
PS.
Petr Sovis said:
Hi matheszabi,
ok, your question was rather compheresive . So right way to find solution is rather complicated too.
I woudn't choose solution according to differences between JDK / NDK to same function calls of OpenGL ES 2.0
According to my experience, performance (and power consumption) is almost the same.
GLOBAL aproach: I suggest
1) you create your application in Java - use JDK versions - creating native function for just few draw calls is, imho, hard compared what you get
2) if your application is NativeActivity
- use direct calls - be prepared for differences between devices, proper creation of surface, .... but it's faster
- subclass Native Activity and use JAVA as well
3) not using OpenGL ES directly at all - i suggest trying layout and buttons / images inside of it, i saw 200 control buttons on 1 screen and it ran perfectly. And layout is movable by 1 command - offset. I suppose, this is completely written in native code anyway. You just get drawing interface in JAVA.
Now, to OPENGL ES itself (JAVA or NDK)
cons:
- OPENGL is 3D interface so pixel perfect drawing is something which is not supported by itself. (note: opengl has pixel / texel center at 0.5 not at 0.0/1.0)
- you need pixel perfect draw - boxes you draw must be perfectly aligned to screen pixels - othewise you get blurry results
- you might not need texturing - thats PLUS, otherwise drawing pixel perfect opengl suraces is "pain in the ..." - viz. texel interpolation and drawing a pixel checker aligned with screen pixels is real nightmare and it differs on each device (I tried )
- pixel perfect with mipmaps - awful again
- alpha blending (when you have something which is transparent) - you will need sorting to draw it properly
- will you need font ? oh my ...
- NO EMULATOR - will need to test each device if it's working properly (not every, at least each vendor)
to consider:
writing vertex/fragment shader in a world with 3500 (number of opengles 2.0 devices according google) suitable devices/compilers/android versions ... ehm
pluses:
- you draw exactly what you want
- use of fragment shader (alhough i suggest using gradient textures instead)
- i suggest draw primitives in vertex buffers (indexed triangles or triangle strips). Not one box by one - compose all in one array and draw it by one draw call. Doubling points in strips can help you
- instancing is not supported) but there is way surpassing this (preparing buffers with)
- i don't recommend using lines with width definition - each implementation draws this differently - and it's equal to drawing lit cylinder
- in native activity loop - handling if you need redraw - it's difficult
I would try normal android GUI first
pluses:
- you get pixel perfect draw, with / without bitmaps, images, gradients ....
- i suppose its fast enough
- no sorting needed
- redraws will be invoked when something changes
- translation / clipping will be handled internally
- no need to care about device !!! that's big plus
cons:
- zoom will be problematic
- rotations as well (but i suppose you don't need them)
note to power consupmption - both OpenGL :
just swaping screen buffers 30 per sec will deplete most of devices within 2-3 hours. But of course, doing it so only when needed is doable
But I might be wrong so best way is to decide by yourself and, of course, try it and see.
If you have qustions about drawing through ES, i'll post some samples of pixel perfect draw (from my gui)
Good luck, post your decision, and if you have some results, post them too! will be very interesting.
PS.
Click to expand...
Click to collapse
Hello thanks for sharing your idea experience.
I have asked in other forum a similar question.
It was a response than the GPU has optimised methods so it will have less power consumption
Also he likes to draw the whole frame not only a part - I'm case of my optimisation
Also I have asked an opengl expert and he told me to use the ortho instead of perspective projection. He has right.
Now I don't have bliry results anymore but is pixel perfect!
For benchmark I made 100 candles : 100 line + 200 triangles.
I have calculated how much is the wigth and the height for the surface => how much space can have a candle and used the matrix transformations and render it.
A nice surprise the fist time it took 18 milliseconds but after that only took 5-6 millisec the. Sdk->ndk->opengl-> SDK steps.
That is very good result on MY trash device. But I think it has a trick: the ndk gives order to render to GPU and it will return. So in those 5-6 milliseconds will start to work the GPU for who knows how much....
Note: audio , video , sensor intensive projects should be developed on real devices not at emulators.
With my method the problem is starting with text drawing and leak of knowledge.
Vbo or texture... Not sure which one but if a native 2D can do it than I can me too.
Cairo as rendering 2d engine is a bit big to include in android.
I still think the ndk is the correct place. Also is isn't so easy to watch the engine code as a decompiled SDK code
Ok! you chose your path - good for you!
18/5-6 ms is just for draw (200 triangles+100 lines) ?, or whole frame time ? Can you tell me the the device you are testing your app on ?
Note: Ortho, i didn't mean to advice perspective transform, ortho is still 3d, and pixel perfect - wait for texturing/text drawing, but you'll manage!
Just few tips to font rendering:
bitmap fonts: I can't add links so google: angelcode bmfont
font bitmap creator: google: angelcode bmfont
+ sample: google: nehe 2d_texture_font
freetype implementation - it's possible to compile it with ndk - i use it and it's simple
google: freetype
and code for starters: google: nehe freetype_fonts_in_opengl
Cheers
P.
Petr Sovis said:
Ok! you chose your path - good for you!
18/5-6 ms is just for draw (200 triangles+100 lines) ?, or whole frame time ? Can you tell me the the device you are testing your app on ?
Note: Ortho, i didn't mean to advice perspective transform, ortho is still 3d, and pixel perfect - wait for texturing/text drawing, but you'll manage!
Just few tips to font rendering:
bitmap fonts: I can't add links so google: angelcode bmfont
font bitmap creator: google: angelcode bmfont
+ sample: google: nehe 2d_texture_font
freetype implementation - it's possible to compile it with ndk - i use it and it's simple
google: freetype
and code for starters: google: nehe freetype_fonts_in_opengl
Cheers
P.
Click to expand...
Click to collapse
My phone is a THL W8S. has FHD resolution
It had a mixed layout, but better I show you:
I have misscalculated the lines positions but for now doesn't matter.
The GLSurface takes a considerable amount of the screen space and that is counted.
On a Samsung Note 10" - at least 1 year old device, lower resolution, but better CPU + GPU it is a lot less this numbers.
My device is a trash (by far not for gamming), I told you:
Hi,
ok, as I understand, the time is just for drawing 200 tris + 100 lines - ok that seems a "little to much" for that.
Besides, your device is not trash at all
I don't know if I can share my examples - but scene from app I released week ago draws 50KTris per frame with some heavy shaders (normal mapping + specular ligting from 2 light sources) and draws text over it + particles + GUI (my ndk gles2.0 engine) and I suppose it will run over 30 FPS on your device (its PoverVR 540 or something) (google play: "Asteroid Hunters" by me)
So, can you post fragment of your drawing code ? maybe there something not really right ?
P
Petr Sovis said:
So, can you post fragment of your drawing code ? maybe there something not really right ?
P
Click to expand...
Click to collapse
I will post, but for me this is good enough others are drawing in 200-2000 milliseconds
The SDK part:
Code:
@Override
public void onDrawFrame(GL10 gl) {
long start = System.currentTimeMillis();
LibJNIWrapper.rendererOnDrawFrame();
long end = System.currentTimeMillis();
//Log.e("Renderer", "onDrawFrame() took: "+ (end-start)+" millisec (1e-6)");
}
The related NDK part:
Code:
void renderer_on_draw_frame() //4
{
LOGE("renderer_on_draw_frame");
//copy
static float grey;
grey += 0.01f;
if (grey > 1.0f) {
grey = 0.0f;
}
glClearColor(grey, grey, grey, 1.0f);
checkGlError("glClearColor");
glClear(GL_DEPTH_BUFFER_BIT | GL_COLOR_BUFFER_BIT);
checkGlError("glClear");
int i;
for (i = 0; i < CANDLES_COUNT; i++) {
//LOGE("chartengine rendering i= %d",i);
renderLine((candles[i].coloredSingleLine));
renderRectangle((candles[i].coloredSingleRectangle));
}
glFlush();
}
line rendering:
Code:
void renderLine(ColoredSingleLine* pColoredSingleLine) {
if (pColoredSingleLine == NULL) {
return;
}
//matrixTranslateM(mvpMatrix, rndX, rndY, 0);
//LOGE("###renderLine pColoredSingleLine %p\n",pColoredSingleLine);
glUseProgram(pColoredSingleLine->programColoredLine.program);
checkGlError("Line: glUseProgram");
// Enable a handle to the triangle vertices
glEnableVertexAttribArray(pColoredSingleLine->programColoredLine.a_position_location);
checkGlError("Line: glEnableVertexAttribArray");
// Prepare the triangle coordinate data
glVertexAttribPointer(pColoredSingleLine->programColoredLine.a_position_location, pColoredSingleLine->lineData.COORDS_PER_VERTEX_LINE, GL_FLOAT, GL_FALSE,
pColoredSingleLine->lineData.vertexStride, pColoredSingleLine->lineData.vertices);
checkGlError("Line: glVertexAttribPointer");
// Set color for drawing the triangles
glUniform4fv(pColoredSingleLine->programColoredLine.u_color_location, 1, pColoredSingleLine->lineData.color_rgba);
checkGlError("Line: glUniform4fv");
// Apply the projection and view transformation
glUniformMatrix4fv(pColoredSingleLine->programColoredLine.u_mvp_matrix_location, 1, GL_FALSE, pColoredSingleLine->lineData.mvpMatrix);
checkGlError("Line: glUniformMatrix4fv");
glLineWidth(pColoredSingleLine->lineData.lineWidth);
// Draw the line
glDrawArrays(GL_LINES, 0, pColoredSingleLine->lineData.vertexCount); // (GLenum mode, GLint first, GLsizei count);
checkGlError("Line: glDrawArrays"); // GL_INVALID_ENUM
//GL_INVALID_ENUM is generated if mode is not an accepted value.
//GL_INVALID_ENUM is generated if type is not GL_UNSIGNED_BYTE or GL_UNSIGNED_SHORT.
GLint error = glGetError();
if (error == GL_OUT_OF_MEMORY) {
LOGE("Out of Video memory error...congrats...is your device a stone ?");
}
// Disable vertex array
glDisableVertexAttribArray(pColoredSingleLine->programColoredLine.a_position_location);
}
and the rectangle:
Code:
void renderRectangle(ColoredSingleRectangle* pColoredSingleRectangle) {
if (pColoredSingleRectangle == NULL) {
return;
}
//matrixTranslateM(mvpMatrix, rndX, rndY, 0);
glUseProgram(pColoredSingleRectangle->programColoredRectangle.program);
checkGlError("Rectangle: glUseProgram");
// Enable a handle to the triangle vertices
glEnableVertexAttribArray(pColoredSingleRectangle->programColoredRectangle.a_position_location);
checkGlError("Rectangle: glEnableVertexAttribArray");
// Prepare the triangle coordinate data
glVertexAttribPointer(pColoredSingleRectangle->programColoredRectangle.a_position_location, pColoredSingleRectangle->rectangleData.COORDS_PER_VERTEX_RECTANGLE, GL_FLOAT, GL_FALSE,
pColoredSingleRectangle->rectangleData.vertexStride, pColoredSingleRectangle->rectangleData.vertices);
checkGlError("Rectangle: glVertexAttribPointer");
// Set color for drawing the triangles
glUniform4fv(pColoredSingleRectangle->programColoredRectangle.u_color_location, 1, pColoredSingleRectangle->rectangleData.color_rgba);
checkGlError("Rectangle: glUniform4fv");
// Apply the projection and view transformation
glUniformMatrix4fv(pColoredSingleRectangle->programColoredRectangle.u_mvp_matrix_location, 1, GL_FALSE, pColoredSingleRectangle->rectangleData.mvpMatrix);
checkGlError("Rectangle: glUniformMatrix4fv");
// Draw the square
glDrawElements(GL_TRIANGLES, NELEMS(pColoredSingleRectangle->rectangleData.drawOrder), GL_UNSIGNED_SHORT, pColoredSingleRectangle->rectangleData.drawOrder); // GL_INVALID_ENUM on Galaxy note
checkGlError("Rectangle: glDrawElements"); // GL_INVALID_ENUM
//GL_INVALID_ENUM is generated if mode is not an accepted value.
//GL_INVALID_ENUM is generated if type is not GL_UNSIGNED_BYTE or GL_UNSIGNED_SHORT.
GLint error = glGetError();
if (error == GL_OUT_OF_MEMORY) {
LOGE("Out of Video memory error...congrats...is your device a stone ?");
}
// Disable vertex array
glDisableVertexAttribArray(pColoredSingleRectangle->programColoredRectangle.a_position_location);
}
At any benchmarks my fps is bellow 12, while other devices has 30 or 50 fps. Believe me not my device has the best CPU + GPU by far:
some output from on old code:
Code:
printGLString("Version", GL_VERSION);
printGLString("Vendor", GL_VENDOR);
printGLString("Renderer", GL_RENDERER);
printGLString("Extensions", GL_EXTENSIONS);
....
void printGLString(const char *name, GLenum s) {
const char *v = (const char *) glGetString(s);
LOGE("GL %s = %s\n", name, v);
}
// ### GT-N8000 ### Galaxy note 10" - GL Renderer = Mali-400 MP
// GL_EXT_debug_marker
// GL_OES_texture_npot
// GL_OES_compressed_ETC1_RGB8_texture
// GL_OES_standard_derivatives
// GL_OES_EGL_image
// GL_OES_depth24
// GL_ARM_rgba8
// GL_ARM_mali_shader_binary
// GL_OES_depth_texture
// GL_OES_packed_depth_stencil
// GL_EXT_texture_format_BGRA8888
// GL_EXT_blend_minmax
// GL_OES_EGL_image_external
// GL_OES_EGL_sync
// GL_OES_rgb8_rgba8
// GL_EXT_multisampled_render_to_texture
// GL_EXT_discard_framebuffer
// ### THL V8S - GL Renderer = PowerVR SGX 544MP
// GL_EXT_debug_marker
// GL_OES_rgb8_rgba8
// GL_OES_depth24
// GL_OES_vertex_half_float
// GL_OES_texture_float
// GL_OES_texture_half_float
// GL_OES_element_index_uint
// GL_OES_mapbuffer
// GL_OES_fragment_precision_high
// GL_OES_compressed_ETC1_RGB8_texture
// GL_OES_EGL_image
// GL_OES_EGL_image_external
// GL_OES_required_internalformat
// GL_OES_depth_texture
// GL_OES_get_program_binary
// GL_OES_packed_depth_stencil
// GL_OES_standard_derivatives
// GL_OES_vertex_array_object
// GL_OES_egl_sync
// GL_OES_texture_npot
// GL_EXT_multi_draw_arrays
// GL_EXT_texture_format_BGRA8888
// GL_EXT_discard_framebuffer
// GL_EXT_shader_texture_lod
// GL_IMG_shader_binary
// GL_IMG_texture_compression_pvrtc
// GL_IMG_texture_compression_pvrtc2
// GL_IMG_texture_npot
// GL_IMG_texture_format_BGRA8888
// GL_IMG_read_format
// GL_IMG_program_binary
// GL_IMG_uniform_buffer_object
// GL_IMG_multisampled_render_to_texture
materials
OK!
i know why it's so slow, you practically draw something 300x per frame and it doesn't really matter if it has 2 trinagles or 300 per one call.
300x setup shader per frame is almost a limit for slower(not slow) devices.
Main issues:
1) do not ever call glGetError when not debugging/running debug build - it makes pipeline stall (pipeline stops and waits until all commands are executed)
2) since you have 100 lines - and using for all of them same program, why not to group them in one array ?
2 solutions
-----------------
A)
= you are not using vertex buffers - so
1) create temporary memory and pre-transform all lines/triangles into one array - will be much faster
2) setup shader once + set uniforms
3) setup attributes - start of temporary array you created (every call - believe me, it will be faster, good practice is create array on stack, but beware of overflow - but for 300 lines is practically impossible)
3) call one draw call for all lines/triangles at once
B) even faster solution (fake instancing) - this is really fast
= create vertex buffer with data (and now create this as real VBO !)
- and not with only 1 instance of line, but with reasonable count - for instance 300 (fake instancing) - 300x line data repeated,
- in tex.x,y (for instance) - set index 0.299 -> x = (float(index % 256) / 256.0f ) y = ( (index & (~255)) / 256.0 ) - using lowp vec2 inTex; attribute
= in shader:
- create uniform array with coordinates for instance uniform mediump vec3 positions[300];
- in vertex part - something like this
gl_Position.xyz = inPosition.xyz + positions[(int) ((inTex.x * 256.0) + (inTex.y * 65536.0)) ];
1) use shader
2) fill array with positions and set it to uniform
3) set attributes
4) draw - and according to situation change count of elements drawn
if you need draw more than 300 lines, enlarge array OR just do more calls this time this is getting efficient
But i suppose 1st solution will be more than enough.
Cheers.
P.
Petr Sovis said:
OK!
i know why it's so slow, you practically draw something 300x per frame and it doesn't really matter if it has 2 trinagles or 300 per one call.
300x setup shader per frame is almost a limit for slower(not slow) devices.
Main issues:
1) do not ever call glGetError when not debugging/running debug build - it makes pipeline stall (pipeline stops and waits until all commands are executed)
2) since you have 100 lines - and using for all of them same program, why not to group them in one array ?
2 solutions
-----------------
A)
= you are not using vertex buffers - so
1) create temporary memory and pre-transform all lines/triangles into one array - will be much faster
2) setup shader once + set uniforms
3) setup attributes - start of temporary array you created (every call - believe me, it will be faster, good practice is create array on stack, but beware of overflow - but for 300 lines is practically impossible)
3) call one draw call for all lines/triangles at once
B) even faster solution (fake instancing) - this is really fast
= create vertex buffer with data (and now create this as real VBO !)
- and not with only 1 instance of line, but with reasonable count - for instance 300 (fake instancing) - 300x line data repeated,
- in tex.x,y (for instance) - set index 0.299 -> x = (float(index % 256) / 256.0f ) y = ( (index & (~255)) / 256.0 ) - using lowp vec2 inTex; attribute
= in shader:
- create uniform array with coordinates for instance uniform mediump vec3 positions[300];
- in vertex part - something like this
gl_Position.xyz = inPosition.xyz + positions[(int) ((inTex.x * 256.0) + (inTex.y * 65536.0)) ];
1) use shader
2) fill array with positions and set it to uniform
3) set attributes
4) draw - and according to situation change count of elements drawn
if you need draw more than 300 lines, enlarge array OR just do more calls this time this is getting efficient
But i suppose 1st solution will be more than enough.
Cheers.
P.
Click to expand...
Click to collapse
Thanks
When I wrote I saw the glerror maybe it will slow down a bit.
Since I am coming from an object oriented development environment it was designed on that way...
The candle: line + triangle can have other data too. Maybe need to keep elsewhere the data...
The last candle line and rectangle and his color can change almost at each draw method: just 1 of the 4 params will nort change.
When the last candle is closed a new one need to be staeted
In this case needs to. Shift to left all other candles. Maybe for this I am keeping in separate methods.
I thought the shader setup is done in other part at least there I am getting the pointer to they. On surface changed/ created - I am not at PC now.
Text with price + time scale should be with a texture to a rectangle?
I will reply inline:
matheszabi said:
Thanks
When I wrote I saw the glerror maybe it will slow down a bit.
Since I am coming from an object oriented development environment it was designed on that way...
Click to expand...
Click to collapse
Object development has nothing to do with this , glGetError is NOT a function to retrieve error status from GL functions, its for debugging purposes only. Its commonly used as: (simple form)
#ifdef _DEBUG
#define CHECKGL(x) x; assert(glGetError() == GL_NO_ERROR)
#else
#define CHECKGL(x) x
#endif
CHECKGL( glUniform4f(.... .) );
or still very fast
#define CHECKGL(x) x; if (globalDebugGL) { assert(glGetError() == GL_NO_ERROR); }
matheszabi said:
Thanks
The candle: line + triangle can have other data too. Maybe need to keep elsewhere the data...
The last candle line and rectangle and his color can change almost at each draw method: just 1 of the 4 params will nort change.
When the last candle is closed a new one need to be staeted
In this case needs to. Shift to left all other candles. Maybe for this I am keeping in separate methods.
Click to expand...
Click to collapse
Again - preparing something to vertex buffer is 100x faster than calling gluseProgram, gluniform and then draw call.
Different values per "candle": you can change (per candle) color, position, tex coords, and another values - to max 16 vec4 attributes per vertex in vertex buffer.
just for your imagination what does exactly glUniform: it recompiles and rebuilds shader with new values. It's not fast at all. So drawing 2 triangles with new shader setup (different uniform values) is not very smart. You have only 800-1000 such operations per frame tops. New card can handle much more. Look for term "draw call batching" to learn more. Unity's main feature.
Just imagine, even chip in your phone can easily draw 20 textured MTris per sec and you draw just few thousands and it's sweating.
Very nice article about GLES 2.0 from apple - google for "OpenGL ES Design Guidelines" most of it is true on android as well
matheszabi said:
Thanks
I thought the shader setup is done in other part at least there I am getting the pointer to they. On surface changed/ created - I am not at PC now.
Text with price + time scale should be with a texture to a rectangle?
Click to expand...
Click to collapse
That differs according to your situation.
- Is price/time always same ? (texture)
- it's changing per frame, (prerender texture)
- it's changing per "candle" ? - I posted articles about text in gl apps in the last post.
I thing you can choose your way !
Cheers
P.
Thanks for answer.
Petr Sovis said:
That differs according to your situation.
- Is price/time always same ? (texture)
- it's changing per frame, (prerender texture)
- it's changing per "candle" ? - I posted articles about text in gl apps in the last post.
Click to expand...
Click to collapse
Price/time is the same until: the user press a button, than will change the time ( From To values) and collecting data will result a min price and a max price. So the price probably will change at that button event, but not all the time.
Also the last candle price value is "moving" at least the close value, but an move the min or max value too, which can be the min or the max of the whole chart, on those rare situations need to change the coordinate system too. Can be used here a trick as it is changing and it will add +20% so what not need to change on each tick (frame)
233528246055
matheszabi said:
Thanks for answer.
Price/time is the same until: the user press a button, than will change the time ( From To values) and collecting data will result a min price and a max price. So the price probably will change at that button event, but not all the time.
Also the last candle price value is "moving" at least the close value, but an move the min or max value too, which can be the min or the max of the whole chart, on those rare situations need to change the coordinate system too. Can be used here a trick as it is changing and it will add +20% so what not need to change on each tick (frame)
Click to expand...
Click to collapse
I would definitely use rendering text technique I already posted. Its very fast (when implemented properly) and you can "print" whatever you want.
One of the following
bitmap fonts: (more content preparations - you need to prepare texture for each font)
-------------------
font bitmap creator: google: angelcode bmfont
+ sample: google: "nehe 2d_texture_font"
freetype implementation: (easier use - free type can generate font you want - also very fast)
-------------------------------------
it's possible to compile it with ndk - i use it and it's simple
google: freetype
and code for starters: google: "nehe freetype_fonts_in_opengl"
Cheers
P.

Categories

Resources