Absolute positioning of child views in a Famo.us ScrollView - famo.us

I've a ScrollView of images, while clicking on an image (read imageSurface), I would like that one to smoothy scale to an absolute location of the screen (for example a fullscreen) this independently of the scroll state. Here is an example of a similar behaviour.
In my understanding, I should find a way to retrieve the current imageSurface location and apply a modifier with an opposite location in order to virtually detach the surface from the ScrollView. Then I might apply the modifier I would like (for example a full screen modifier).
Another option would be to override the ScrollView's render() function but I'm not sure it is a good/safe idea.
Removing the image from the sequence to quickly add it somewhere else but attached to another modifier (not in the scrollview) is also an alternative but I fear having glitches and not being able to fade it back to the sequence correctly.
Any idea on how to achieve this ?

Related

Surface html content with sub-surfaces

What is so recommend way to do the following?
I have a surface with some html content which is layouted by the browser.
Within the html a want to have an extra Scrollview with surfaces.
Where to get the x,y, and width, height for the Scrollview from?
Do i have to wait for the html to be rendered an THEN convert the inner-html part into a surface?
You can not use Surfaces as containers for other surfaces. You need to collect all your surfaces in a View, RenderNode, or ContainerSurface object.
https://github.com/Famous/core/blob/master/View.js
https://github.com/Famous/core/blob/master/RenderNode.js
https://github.com/Famous/surfaces/blob/master/ContainerSurface.js
Remember that the way that Famo.us lays out content is in the style of a render tree. With a tree analogy, the Surface would be a leaf, where the aforementioned Objects would act more like branches.
Here is everything you need to know about the Famo.us RenderTree:
https://github.com/Famous/guides/blob/master/dev/2014-04-09-render-tree.md
Also, take a look at the examples for each of the Objects mentioned as well. You can find the one that fits your use case best..
https://github.com/Famous/examples/blob/master/src/examples/core/View/example.js
https://github.com/Famous/examples/blob/master/src/examples/surfaces/ContainerSurface/example.js
Hope this helps!

How to scale a QGraphicsEllipseItem with the Zoom Level of QGraphicsView

I have a QGraphicsView on a widget which im adding a number of items to.
some of these are polygons and some are ellipses (Both QGraphicsItems) when i zoom the Graphics view
void Test::on_verticalSlider_sliderMoved(int position)
{
ui->graphicsView->scale(1.1,1.1);
}
the ellipses just get bigger and bigger but i want them to shrink so that they basically stay the same shape no matter how far zoomed in i am, so basically i want the polygons to be zoomed in on but not the points i have plotted onto these polygons...if that makes sense
dont know it makes it easier but all of the ellipse points plotted at any one time are within the same QGraphicsItemGroup so there could be a flag i can set on the entire group to do this?
anyway i would be greatful for any help with this
thanks
EDIT ------ CODE SAMPLE
item is the QGraphicsEllipseItem, and m_group_point is a QGraphicsItemGroup
item->setParentItem(m_group_point.get());
then i add the group to a scene
m_scene2->addItem(m_group_point.get());
then add that scene to the view
ui->graphicsView->setScene(m_scene2.get());
they are .get because they are shared pointers
well, ignoreTransformation indeed a proper way to go.
QGraphicsItem::ItemIgnoresTransformations: The item ignores inherited transformations (i.e., its position is still anchored to its parent, but the parent or view rotation, zoom or shear transformations are ignored). This flag is useful for keeping text label items horizontal and unscaled, so they will still be readable if the view is transformed. When set, the item's view geometry and scene geometry will be maintained separately. You must call deviceTransform() to map coordinates and detect collisions in the view. By default, this flag is disabled. This flag was introduced in Qt 4.3.
About stay in the middle, you should move ellipses within scene to proper position, so they have proper scene coordinates, and then you instruct to ignore transformation of the view, so they will ignore any zooming/rotation/etc as mentioned in documentation.
The Qt docs states this about the flag QGraphicsItem::ItemIgnoresTransformations: -
The item ignores inherited transformations (i.e., its position is
still anchored to its parent, but the parent or view rotation, zoom or
shear transformations are ignored).
Which is what you want. You've added your items to a QGraphcisItemGroup. For this, Qt help states: -
QGraphicsItemGroup ignores the ItemIgnoresTransformations flag on its
children (i.e., with respect to the geometry of the group item, the
children are treated as if they were transformable).
Reading into this, the QGraphicsItem uses the ItemIgnoreTransformations flag based on its parent, which in your case is the QGraphicsGroup, but this class ignores the flag on its children, which is likely to be causing the issue you're seeing.
Therefore, do not set the flag on the parent group, but on its children.
Try setting the ItemIgnoresTransformations flag on the objects that you want to keep constant-sized.

Overlay items in qtgraphicsscene

I would like to draw some dynamical overlay elements in a scene.
Usually I would go for the paintEvent in the view or foreground painting for doing overlays, but this time I need to interact with these elements: they are like every other item in the scene... Mostly, this choice comes from the fact that these items are somewhat complex, and they share the rendering with other QGraphicsItem(s).
The problem is that, being overlayed, they shall be treated a bit differently than any other element in the scene: rendered in view coord space, not in scene coord space, and ignore changes in the view rect, dragging, dropping, rubber band selection, and such.
The question is somewhat general: how could I use the scene for a thing like this? Is there a better option for doing overlays e.g. using multiple scenes and rendering them all, in some magic way, in a single view widget?

Question regarding image tiling in a QGraphicsView

This is related to one of my other questions.
If I am tiling a large image by creating a separate QGraphicsItem (with the raster data as its pixmap), how do I keep track of the QGraphicsItem's position within the scene? Obviously for raster data, it is important to keep all the tiles "touching" to make a continuous image and they also have to be in the right place so the image doesnt look jumbled.
Does each tile have to have positioning methods that move it in relation to it's neighbors on the top/left/bottom/right? This seems kind of clunky. Is there a better way to make them all move together?
In other words, if I pan the scene with scroll bars, or pick up the image and drag/move it around in the scene, I want all the tiles to also move and stay in the right position relative to each other.
What is the best approach for controlling the layout, which tiles need to be rendered (i.e. only the visible ones), and populating the data only once it is needed? Also, once a tile has been rendered, is the data from it ever dropped, and repopulated from the image file, say if it stays out of view for a while, then comes back later if someone pans to that section?
There are (more than) 2 ways of doing this:
Use QGraphicsItemGroup which
handles grouping of your tile items
for you. It moves, selects, updates
it's group members as if they are
one. I've never used it but from the
doc, it seems to work with typical
applications.
Paint the tiles yourself in the
paint() of one custom item. This
gives you total control on how to
place and draw the tiles while the
item truly acts as one item since it
is, well, one item. This is what I
do.

Hiding/Removing/Fading CALayer erasing NSView contents

My situation:
I have a single window with a content view (NSView), which has several subviews (plain NSControl subclasses; not important, just for testing) scattered around it. For part of the end effect I am trying to achieve, I want to place a semi-transparent black CALayer overlaying the whole window's content view, and be able to make it invisible (either by hiding it or removing it, doesn't matter) when a certain event is triggered, revealing the NSViews in full clarity.
For testing purposes, I place a small semi-transparent black CALayer covering only some/parts of the subviews (the controls) in the main content view, like so:
(doh, had screenshots but can not post images as a new user. You'll have to use your imagination.)
Simple enough. So then all I tried to do was to check that it hides/removes itself properly. Then came the problem. Any attempt at hiding, removing or reducing the black layer or reducing its transparency to 0 causes all of the window's subviews to become erased, with a result looking like this:
(a window with a completely blank grey [the default window bg colour] content view)
Here's the meat of the code, in the main application call which has a reference to the main window:
// I set up my main view in a nib, which I load and will add
// to the app window as the main content view
NSViewController * controller = [[NSViewController alloc]
initWithNibName:#"InterfaceTesting" bundle:nil];
NSView * view = [controller view];
// enable layers, grab root
[view setWantsLayer:YES];
CALayer * rootLayer = [view layer];
// set up black square
CALayer * blackLayer = [CALayer layer];
[blackLayer setFrame:NSMakeRect(150, 150, 100, 100)];
[blackLayer setBackgroundColor:CGColorCreateGenericRGB(0,0,0,0.5)];
[rootLayer addSublayer:blackLayer];
// hide all sublayers of root (ie the black square)
for (CALayer * layer in [[view layer] sublayers])
[layer setHidden:YES];
// add to main window
[self.window setContentView:view];
As I mentioned before, replacing [layer setHidden:YES] with [layer setOpacity:0] has the same effect of erasing the content view, as does removing the blackLayer altogether (by calling removeFromSuperlayer and also by trying to set its superlayer to nil). More interesting still, if I set the opacity of the black sublayer square to something between 0 and 1 - 0.5, say - then all of the content view's subviews' opacities reduces accordingly.
So I'm rather baffled here, as I don't understand why hiding/removing or reducing opacity on the small black CALayer is affecting all the subviews in the view it is a part of, even those it doesn't cover. Any help is much appreciated.
Edit: Well I've discovered that the contentView's top layer in fact has a sublayer not only for the black square I manually added, but for every subview as well (whether originating from the nib or manually created by me after loading the view from the nib), hence why they were all fading/disappearing when I thought I was just operating on the black box. But what I still don't know is why there are layers for all the subviews, where they came from, and how to get rid of them (again, all attempts to remove them - via removeFromSuperlayer, setting to nil, etc - fail.
Subviews (controls) have layers which are set as sublayers of the parent view layer. So looping through all the sublayers also acts on these subview layers.