UI Like Youtube in Android (Tablet) - user-interface

I've spent 2 hours looking for a solution. I need to make a design
like the Youtube UI (Tablet UI) where it shows a vertical scroll, but
in each row there are 4 videos (landscape view). I've tried to do
something similar, but i couldn't =(
Is there any place where i can get the source code of the youtube
application for Tablet? Or maybe some resource to solve this? :(
BTW, my try was designing UI with scrollView, LinearLayout and my_item.xml, i tried to inflate my_item.xml adding programmatically into the linearlayout (horizontal orientation), but it doesn't work in the way that i want. I need something like a linearlayout but with horizontal and vertical orientation at the same time (something like a div).
I was thinking to use a ListView and a custom adapter (with my_item.xml), but i'm not sure if this can be the best solution.
Thxs

You should create seperate resources for each layout.
For example if the user is in Portrait mode you would have the correct layout in.
layout-port: layout for portrait orientation
layout-land: layout for landscape orientation
Read more on providing alternative resources here
Also i would recommend to read more on Handling runtime changes
This will help you with recognizing when the user changes orientation. You could actually use this guide and when the user flips the devices orientation you could then change the layout. Keep in mind hard coding this can be dangerous though. I would recommend using the layout folders.
Good luck!

Finally i solve my problem.
It works with a linearLayout(vertical) and adding linearlayout(horizontal) for each row. And obviously managing my scrollview.
BTW, i still think android should have a layout like a "div".
Thxs all

Related

SKSceneScaleModeResizeFill on ios8 scales improperly

I have written a game in SpriteKit using objective C and it works perfectly on ios9 but it looks hideous on ios8. I would really like to know how to fix this problem, either by “correcting” my mistake, or if I have no mistake then by finding a workaround for the bug in ios8.
I think I have really done all I can to make the problem as clear as possible, including making loads of screenshots to illustrate the problem and also making a new Xcode project that is as simple as possible while still showing the problem.
If you want to try the Xcode project, here is a link for it….
xcode project
If you want to see the screenshots of the problem, then here is a link for the screenshots.
Screenshots
Now I will try to explain the code I wrote and the problem illustrated in the screenshots.
PLEASE REMEMBER: My code works perfectly on iOS9.3. So my code is obviously not complete gargage. But admittedly, I am not an expert on handling screen rotation, so probably my code could be better.
I should probably mention that both scenes have scale mode set to SKSceneScaleModeResizeFill. I chose this mode because I had tremendous difficulty doing proper layouts for all possible screen sizes (including iPhone) when working with SKSceneScaleModeAspectFill. I do I hope I can solve this problem while sticking with SKSceneScaleModeResizeFill.
Anyway, my app is a SpriteKit game with two scenes. The main scene is the GameScene, where you play the game. And this scene has a pointer to the SettingsScene, where you can change the settings of the scene. (e.g. change the level of difficulty).
Anytime the user rotates the screen, GameViewController detects this change in viewWillTransitionToSize and tells the GameScene object about the new screen width and screen height. Game Scene then adjusts the positions of its sprites in consideration of the new screen orientation and then tells its SettingsScene object about the new screen width and height to that the Settings scene is properly laid out as well.
Please note that with this design, all sprites on BOTH scenes get repositioned any time the user rotates the screen REGARDLESS of which scene is actually active at that time..
As I said before, all works as expected on ios9.3. But on ios8, the result is attrocious. The screenshots illustrate one example of typical experience on ios8. If the user rotates the screen while using the game and then goes to the settings screen, he will see something awful. And will often be trapped in this terrible experience because the button for going back to the main game might not even be fitting on the screen anymore.
At first, it might seem like I am failing to reposition sprites for landscape mode in the settings scene. But this explanation is wrong. The text on the screen shows that the last layout was performed with the landscape orientation in mind.
So what is going wrong here?
Any suggestions would be highly highly highly highly appreciated.
Thanks!
-j
p.s. In case you don't want to look directly at the linked project file, here are some details about the example code. GameViewController implements viewTransitionToSize to handle any screen rotation. It directly tells the new screen dimensions to GameScene, which then tells SettingsScene. Both scenes rearrange their sprites in consideration of the new screen dimensions. And all goes well on ios9. On ios8, however, the inactive scene ends up looking hideaous when it is presented even though it clearly did reposition its sprites according to the new dimensions.
the problem is easily resolved by these lines....
gameScene.size = newScreenSize;
settingsScene.size = newScreenSize;
anytime the orientation changes.
This code is not required for ios9. The scene knows what size the screen is without assistance. But for ios8, it seems to be needed to add this code.

Adaptive Layout in Xcode 7.0.1

I have an app that displays properly in portrait view but truncates in landscape view:
From the research I have done it looks like I need to understand Size Classes and Adaptive Layout. However, I am only concerned with layout on iPhone 6, not across different devices (eg iPad).
Before jumping into Adaptive Layout and Size Classes, which seems quite a complex topic, I just wanted to ask if there is a simple way to make this app display properly in both portrait and landscape for iPhone 6.
Thanks in advance!
Yes, you can do it without size classes, but it requires a reasonable modification to your UI.
If you think about it then having a picker always visible makes no sense for you. Looking at your image I am puzzled as to which date is currently being adjusted.
What you want to do instead, is to make your picker appear after user clicks on one of the dates. You can make it slide up from the bottom. In addition, you can add a label above it which will clearly indicate which date the user is currently modifying. That label can be placed in the toolbar to make it easy to add "Done" and "Cancel" buttons to the left and to the right.
In my view it would make much more sense and would also solve your problem. The rest of the UI can be put in the scroll view if you don't have enough space on old devices (e.g. 3.5 inch iPhones)

SFML RenderWindow Views and GUI

I dont know how many people have use SFML, but I basically want to draw my GUI and am unsure of how to do so.
To clarify I know how to draw a GUI but I don't know the 'correct' way to do so.
Currently I am drawing a GUI in the same RenderWindow that is used to draw the Game.
I have started to introduce Views into my game, I have a Game View and a GUI View, which take up 75% and 25% of the screens height (respectively).
Now the question is:
Should I render the GUI in the same RenderWindow but in a portion of the 'map' the player is unable to reach and have the GUI View locked on that location displaying the GUI.
Another idea I have thought of (unsure if it is plausible) is to have a second RenderTarget which renders the GUI and is dispalyed in the GUI View.
If there is a method I have not discovered or one that is recommend I am happy to hear about it, I searched but all I have found is the SFML Documentation in which I couldn't find my answer.
Your question is slightly confusing as I do not know whether you are having a design issue, or a technical issue of implementing the UI. In terms of the design issue:
I have started to introduce Views into my game, I have a Game View and a GUI View, which take up 75% and 25% of the screens height (respectively).
I haven't encountered where using multiple views will be needed for an UI. Take this example:
The UI consists of all the images in the black area. The positions' of those images are always updated relative to the position of the game view that follows the player around, nothing more. A second view isn't needed because the components (images) of the UI follow the view around, just as the view follows the player around.
Now, if you are having a technical issue, then please elaborate on the exact issue that has some accompanying code and I will do everything I can to help out.

How do you implement custom views similar to Conversations in OS X Lion Mail?

I'm wondering how to implement views similar to the conversation views in mail (for Lion).
http://images.apple.com/macosx/whats-new/images/mail_conversation_screen.jpg
I want the effect where it looks like a sheet of paper laying on the background.
I'm thinking that it may just be a view based table view.
A nudge in the right direction would be fine. Just need to know where to look to find out how to do it.
Thanks in advance.
It could be a view based table view or just a normal container view with some simple tiling logic (ie, "roll through each subview and set their frames"). The effect you're looking for, though, can be easily accomplished with layer-backed views with a background shadow enabled.
There are several perfectly valid approaches to this goal (the layout and drawing parts). Pick one, start down the path, then post questions as problems arise.

Creating a quick look style zooming effect

I would like to create an effect than an image zooms up from a thumbnail size to full screen.
I am not sure what's the right steps to achieve this. Should I create a transparent full screen window and animate a layer on top of it?
Take a look at this CoreGraphics example. Specifically, take a look at the "grow" and "shrink" animations. That's how Apple does it, and that's what you'll want to do too.
Your solution of a transparent window with a CALayer inside is probably the best supported way to do it.
One thing that seems like it should be a good solution (at least it's the first thing I thought of when I wanted to do this) but isn't is NSView's enterFullScreenMode:withOptions:. If memory serves, it was originally meant to do what you're talking about here, but the animation was taken out and it generally doesn't work that well now.

Resources