I am trying to implement a zoom in function to my app.
The idea is when I chose to zoom in, the graph should expand horizontally 2 times larger so that only half of the graph will be shown in the window, and one will need to scroll to see the other half despite the size of the window.
I have a zoom variable for zoom factor. Then in onDraw(CDC &pDC):
//...set pen and others...
CRect rect;
GetClientRect(rect);
for (int x=0; x < zoomFactor*rect.Width(); x++)
//....draw the graph
then in onToolsZoomin():
void CMyGraphView::OnToolsZoomin()
{
zoom *= 2;
CRect rect;
GetClientRect(rect);
CSize sizeTotal;
sizeTotal.cx = zoom*rect.Width();
sizeTotal.cy = 0;
SetScrollSizes(MM_TEXT, sizeTotal);
this->RedrawWindow();
}
When I run this, I can have the window correctly draw half of the graph and a scrollbar that indicate only half of the graph is shown. But when I try to scroll it, it goes back to the original position (bottom left) and the other half of the graph won't show up.
The parameters in both functions are not the same one. It can be the first reason of the problem.
Can you put the code that is suppose to call OnToolsZoomin please ? Is it handled through a WM_VSCROLL or WM_HSCROLL message ?
Is your function OnToolsZoomin called at all ?
Is you scrollbar properly initialized (scroll range) ?
Related
I would like to rotate my watches display to a variable degree like a compass does in real life? So far I have only discovered this function within the samsung API
screen.lockOrientation("portrait-secondary");
I would like more control than this, if that means using the native API, that's fine but I need help on where to look.
You may try using evas_map_util_rotate() function to rotate an object. It rotates the map based on an angle and the center coordinates of the rotation (the rotation point). A positive angle rotates the map clockwise, while a negative angle rotates the map counter-clockwise.
Please have a look into Modifying a Map with Utility Functions section of this link. It contains an example which shows how to rotate an object around its center point by 45 degrees clockwise.
You may also use below sample code snippet.
#param[in] object_to_rotate The object you want to rotate
#param[in] degree The degree you want to rotate
#param[in] cx The rotation's center horizontal position
#param[in] cy The rotation's center vertical position
void view_rotate_object(Evas_Object *object_to_rotate, double degree, Evas_Coord cx, Evas_Coord cy)
{
Evas_Map *m = NULL;
if (object_to_rotate == NULL) {
dlog_print(DLOG_ERROR, LOG_TAG, "object is NULL");
return;
}
m = evas_map_new(4);
evas_map_util_points_populate_from_object(m, object_to_rotate);
evas_map_util_rotate(m, degree, cx, cy);
evas_object_map_set(object_to_rotate, m);
evas_object_map_enable_set(object_to_rotate, EINA_TRUE);
evas_map_free(m);
}
Hope it'll help.
In my ContentPage (which takes up the whole screen), I'm setting the SizeChanged event as follows:
private void init()
{
EventHandler orientation_update_handler = (object sender, System.EventArgs e) =>
{
var binding_context = BindingContext as MyViewModel;
binding_context?.OnOrientationChanged(Width, Height, Scale);
};
SizeChanged += orientation_update_handler;
orientation_update_handler.Invoke(null, null);
// other event handler setup...
Trying to set a breakpoint within orientation_update_handler but that's not getting hit...
Anyways; set a breakpoint in OnOrientationChanged. The width and height it's receiving are both half of what they actually are, and the scale always seems to be 1.
However, in my App delegate's FinishedLaunching function, while UIScreen.MainScreen.Bounds.Width always seems to be the same as ContentPage.Width, UIScreen.MainScreen.Scale on the other hand is different to ContentPage.Scale and multiplying UIScreen.MainScreen.Bounds.Width by UIScreen.MainScreen.Scale gives me the correct screen resolution of the device.
Why is ContentPage.Scale always 1? If it were the correct value, I could multiply by the width and get the correct screen resolution.
Why is ContentPage.Scale always 1? If it were the correct value, I could multiply by the width and get the correct screen resolution.
This is a misconception. Width and height are not given in physical pixels, see here
Apple iPhone and iPad devices continue to work in units of points
and
Android is similar. Programmers work in units of density-independent pixels (dps)
in both systems 160 units equate to one inch (or 64 units translate to 1 cm).
I made a galaxy sketch in p5.js using rotates and radians, but it's erased each time the background() is loaded as draw() runs. Is there a way to over-ride the background() function? I want the galaxies to remain in view.
var stars;
function preload(){
//for (var i = 0; i < planetArray.length; i++) {
//stars = loadImage('Assets/stars.png');
}
function setup(){
createCanvas(windowWidth, windowHeight);
}
function draw() {
//background(0);
star()
//function mousepressed(){
}
function star(){
//angle = map(mouseX, 0,width, 0,360);
//rotate(radians(angle*100));
noStroke();
//translate(width/2, height/2);
translate(mouseX,mouseY);
fill(0);
rotate(radians(frameCount%360)); //rotates output of ellipses
rotate(radians(1000*frameCount%360));
for(var i =0; i < 20; i++){
push();
noStroke();
fill(random(200),0,random(150),random(2));
// fill(random(125),random(250),random(100));
ellipse(10*frameCount % (width/10),0,10,10);
//image(stars, 10*frameCount % (width/2),0,10,10)
//image((10*frameCount % (width/2),0,10,10)
//
pop();
}
}
Well, there really isn't any magic to it. Calling the background() function fills the window with a solid color (or image) and draws over anything you've previously drawn.
The solution to this problem isn't to "over-ride" the background() function. It's to restructure your program so your stuff gets drawn properly. Exactly how you do that depends on exactly what you want to happen.
Option 1: Only call the background() function once.
If you just want a black background at the beginning, and everything you do from the draw() function should still add up, then maybe you just want to call the background() function once. You could do it as the last line in your setup() function, for example.
Option 2: Store everything you want to draw in a data structure.
This is probably the most typical case. If you want a background to be drawn behind shapes that are moving around, you're going to have to store those shapes in some kind of data structure, and then draw all of them every single frame.
Option 3: Draw to an off-screen image, and then draw that image on top of your background.
This is a bit of a mix between the first two options. You can draw everything (except the background) to an off-screen PImage, and then draw the background to the screen, then draw the image to the screen. This allows you to have a background that changes colors without having to redraw everything else.
Which option you choose really depends on exactly what you want to happen.
I want to have a fullscreen mode that keeps the aspect ratio by adding black bars on either side. I tried just creating a display mode, but I can't make it fullscreen unless it's a pre-approved resolution, and when I use a bigger diaplay than the native resolution the pixels become messed up, and lines appeared between all of the tiles in the game for some reason.
I think I need to use FBOs to render the scenario to a texture instead of the window, and then just use a fullscreen approved resolution and render the texture properly stretched out in the center of the screen, but I just don't understand how to render to a texture in order to do that, or how to stretch an image. Could someone please help me?
EDIT
I got fullscreen working, but it makes everything all broken looking There are random lines on the edges of anything that's written to the window. There are no glitchy lines when it's in native resolution though. Here's my code:
Display.setTitle("Mega Man");
try{
Display.setDisplayMode(Display.getDesktopDisplayMode());
Display.create();
}catch(LWJGLException e){
e.printStackTrace();
}
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glOrtho(0,WIDTH,HEIGHT,0,1,-1);
glMatrixMode(GL_MODELVIEW);
glEnable(GL_TEXTURE_2D);
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glHint(GL_PERSPECTIVE_CORRECTION_HINT, GL_NICEST);
glHint(GL_LINE_SMOOTH_HINT, GL_NICEST);
try{Display.setFullscreen(true);}catch(Exception e){}
int sh=Display.getHeight();
int sw=WIDTH*sh/HEIGHT;
GL11.glViewport(Display.getWidth()/2-sw/2, 0, sw, sh);
Screenshot of the glitchy fullscreen here: http://sta.sh/021fohgnmxwa
EDIT
Here is the texture rendering code that I use to draw everything:
public static void DrawQuadTex(Texture tex, int x, int y, float width, float height, float texWidth, float texHeight, float subx, float suby, float subd, String mirror){
if (tex==null){return;}
if (mirror==null){mirror = "";}
//subx, suby, and subd are to grab sprites from a sprite sheet. subd is the measure of both the width and length of the sprite, as only images with dimensions that are the same and are powers of 2 are properly displayed.
int xinner = 0;
int xouter = (int) width;
int yinner = 0;
int youter = (int) height;
if (mirror.indexOf("h")>-1){
xinner = xouter;
xouter = 0;
}
if (mirror.indexOf("v")>-1){
yinner = youter;
youter = 0;
}
tex.bind();
glTranslatef(x,y,0);
glBegin(GL_QUADS);
glTexCoord2f(subx/texWidth,suby/texHeight);
glVertex2f(xinner,yinner);
glTexCoord2f((subx+subd)/texWidth,suby/texHeight);
glVertex2f(xouter,yinner);
glTexCoord2f((subx+subd)/texWidth,(suby+subd)/texHeight);
glVertex2f(xouter,youter);
glTexCoord2f(subx/texWidth,(suby+subd)/texHeight);
glVertex2f(xinner,youter);
glEnd();
glLoadIdentity();
}
Just to keep it clean I give you a real answer and not just a comment.
The aspect ratio problem can be solved with help of glViewport. Using this method you can decide which area of the surface that will be rendered to. The default viewport will cover the whole surface.
Since the second problem with the corrupt rendering (also described here https://stackoverflow.com/questions/28846531/sprite-game-in-full-screen-aliasing-issue) appeared after changing viewport I will give my thought about it in this answer as well.
Without knowing exactly how the rendering code for the tile background looks. I would guess that the problem is due to any differences in the resolution between the glViewport and glOrtho calls.
Example: If the glOrtho resolution is half the viewport resolution then each openGL unit is actually 2 pixels. If you then renders a tile between x=0 and x=9 and then the next one between x=10 and x=19 you will get an empty space between them.
To solve this you can change the resolution so that they are the same. Or you can render the tile to overlap, first one x=0 to x=10 second one x=10 to x=20 and so on.
Without seeing the tile rendering code I can't verify it this is the problem though.
I am just staring with processing.js and I have been having trouble because every time I rotate an image it also changes its location on the screen. So what processing seems to do is, rotate my image around the point I told it to place it, instead of rotating it first around its own axis and then placing it where I told it to (which I figured cannot be done in that way/order).
This is the code
PShape s;
float angle = 0.1; //rads
s = loadShape("sensor.svg");
s.rotate(angle);
//I change this angle manually or with my clickMouse function which isnt shown.
void setup(){
size(400,350);
frameRate(30); //30 frames per seconds
}
void draw(){ //shape( shape, x, y, width, height);
smooth();
fill(153);
ellipse(200, 350/2, 100, 100);
shape(s, 200, 350/2, 20, 20);
ellipse(200, 350/2, 2, 2);
}
What I am basically trying to do is make this "sensor" image rotate in the correct orientation around the circle (ellipse) that I drew. Thats the idea. Its doing neither. Maybe having a click function that rotates the SVG image around the circle. But instead it rotates around the coordinates of the shape(image, x_coord, y_coord, width, height) function. If anyone has any suggestions, I would be so happy! Hope my question makes sense, if it doesnt I would be more than happy to clarify any part of it.
Thanks! :)
It's much easier not to rotate your shape, but to rotate the coordinate system.
void draw() {
translate(s.width/2,s.height/2);
rotate(PI/4);
shape(s);
resetMatrix();
// keep on drawing here
}
This first moves the coordinate system so that (0,0) is on top of the center of your shape, then rotates the entire coordinate system by 45 degrees, then draws your shape. Then you reset the coordinate system and keep drawing as usual.