I'm planning to implement tutorial screen for Android app.
My plan is that tutorial screen looks like:
There are several screens and you can swipe between than. Every view has custom design. There are dots which represents every screen, and show what page are you watching now. I need good-looking transition with adequate animations.
This screen will be full screen activity.
I have found several Image Galery, but I don't want to slide between images, I need to slide between views.
I do not need exactly code for this. I need instruction in which way this can be done, and what elements I need to use in order to achieve targeted design.
Thanks in advance.
You'll want to use ViewPager in conjunction with Fragments, the instructions are on Android developer's website.
Related
I'm struggling to implement the expand feature of the card view described by the Material Design for Android.
In their design guidelines they show off different layouts for the Card component, but one example shows a card transition to fullscreen onClick.
This is the transition shown on their website:
I've tried out implementing a feature like this, but it would require much more work than what their guideline examples are suggesting... How does Material Design accomplish this? Is there a built-in feature for this, should I just manually translate and fit the card to fit the screen, or should I use an entirely new fragment or activity for the full-card-view?
Here are the Design guidelines, which contain that example, but nothing is said about the transition, neither on the documented Develop page, which is minimal really.
TL;DR
In the case of the gif image you've attached above, the RecyclerView and the detailed CardView should have their own separate Fragments which are operated in one single Activity.
Jump to the links at the end for the animation part.
Detail
Why so? Well, we had three choices:
Keep both Views in one Activity and overlap the detailed CardView on top of RecyclerView on click event. (This one is stupid, and not a good practice)
Create separate Activities for both Views (Recycler & fullscreen-Card)
The one I mentioned above.
RecyclerView and Detailed View shown as two separate Fragments
Now the reason for not choosing the 2nd option was because it is more performance intensive as compared to the 3rd one. We may not notice this in a small scale app but it certainly makes an impact when the app scales. Plus, creating fragments is more effective as we are sharing common views and variables in between the Views. So the best choice is number three. Note that this isn't a universal case and the usage will differ according to your requirement.
Using Fragments can be overwhelming at first but it keeps the code more organised when you get a hang of it. You should try to keep your app divided into few broadly divided activities and within those should be as many fragments as you want.
Here's a few links that helped me implement the exact same thing you're looking for.
MDC: Material Motion
Implementing Motion with MM
Building Transitions with MM
Hands-on experience in Codelab
All three of them helped me gain a better understanding on how the whole Material Motion framework works and how to implement it in my program.
I need to design introduction walk-through screens when my app launches. It can be done by simple ViewPager or horizontal scroll view (?) but the additional requirements which are hindering me from using these are
A lot of animations on each screen
Animations will be bound to scroll position (i.e., current stage on an animation will be determined by how much user has scrolled, and it should roll back animation if user scrolls back without finish gesture)
Some items need to animate across different screens (e.g., There is a box on first screen, when user scrolls to the next screen, the box becomes larger without moving and a graph (a part of second screen) also comes into display under it)
I dont know if I explained the scenario well enough so please ask for clarification in comments. I need just a direction to control/approach/library.
Thanks
I'd recommend this library : ShowCase
In this way, you can make interactive tutorial and walkthrough your app.
You can also take this library and add some functionality.
Use viewpager, for each fragment you can use different animation inside that fragment, each fragment is independent from other views/fragments
You can use horizontal scroll view but it will take extra time and difficult to code
Seems like a ViewPager has everything you need.
I have 2 screens black with scroll View in it and then I would like to change these screen with a swipe. I am using Android Studio and want to have a simple example so that i could change all the screens from one to other using swipe view. I hope the best example from the all the best developers on opposite side.
Thanks.
View Pager will be the best suited component. There are a lot of samples available in the net.
My goal is to create a screen similar in function to the Stream page in the Google+ app (picture below for those unfamiliar). For the paging, I am using a custom ViewGroup so that it has smooth transitions that "follow your finger" rather than just snapping to the destination after the fling gesture has been made.
Question
Currently, I am going the route of using some TranslateAnimations to move the headings ("Nearby," "All circles," and "Incoming" in the screenshot) once a new page has been selected. This creates a couple of problems: the center heading doesn't follow the user's finger (as you can see the "All circles" heading does in the screenshot), and if the user begins on a page other than the middle one, I have not found an easy way to offset all of the animations temporarily without running them first since the animations do not move the actual views.
Am I going about this the correct way, or is there a much simpler way of accomplishing this that I am overlooking?
Thanks
After hours of searching and a little luck with search terms, I came across A Google+ like ViewPager page indicator.
I also came across Android ViewPager Indicator, created by the same developer who wrote ActionBarSherlock. Has a ton of examples, and is pretty easy to integrate with the FragmentPagerAdapter.
Google has published his own solution in support library.
Check:
PagerTitleStrip,
PagerTabStrip
Have just used ViewPagerIndicator solution and its very nice and smooth. You can demo the effect by looking at the demo from the Android Market here
I am not 100% sure, but I think it uses the new ViewPager.
Maybe you should look at the API 4+ Support Demos:
FragmentStatePagerSupport.java
FragmentPagerSupport.java
I am making a quiz application in which i am planning to use the SlidingDrawer control for displaying different question numbers. Clicking on a number will allow the user to jump to a specific question.
I have implemented the sliding drawer control but it is able to display only 6-7 buttons inside it depending on the screen size. Trying to add more buttons to it gives an exception.
I tried using a GridView inside the SlidingDrawer but i keep getting an error.
Is there anyway i can have around 20-30 buttons inside the SlidingDrawer control arranged in a grid like manner ?
Please give suggestions on any other way i can implement similar functionality in a way that doesn't take up much screen space ?
Yes, it's possible, as a matter of fact previous Android versions (1.6 if I'm not wrong) implemented the application Launcher that way.
Search the source for that version and you'll have a working sample.