Multi-page application with corresponding pictures and text - java

I'm new to Java and Android. I have been trying for the past week to make an app for my phone. The app consists of 4 pages, which are diagrammed below:
Page 1: Contains a picture taking up the size of the screen. If I click on the picture it needs to go to "page 2".
Page 2: Consists of an icon on the left (say the flag for instance) followed by a text field (eg. USA). When "USA" strip is clicked it needs to go to page 3.
Page 3: Consists of text, picture and then more text from a string. This page needs to correspond to the strip clicked on in page 2 ("USA" in this example). There are also two buttons at the bottom of "page 3" and "page 4" which when pressed need to go to the corresponding page numbers.
Page 4: This page is displayed if the "More" button is pressed on "page 3".
I would like this phone to work on a minimum Android 2.2 or 2.3. All logos, pictures and string texts need to be locally available (resources folder) and not website based. I have tried all sorts of combinations of ListView's and buttons with OnClickListener's as well as toast screens. My limited knowledge of programming is frustrating.
My question is if there is a template around which will help me out with this app? Or if there are any web resources.

In Android, individual "pages" or "screens" can be implemented as Activitys. You need to extend the Activity class and add the components that you wish to display. Most of the layout can be done in an XML file. I strongly suggest that you google for a tutorial that illustrates the basics of Android programming. From there, you can start by creating an app with two pages. And then just keep adding a little bit at a time until you get the complete app that you want.

There some easy ways to do this. If you want to be backwards compatible to SDK 8 you can do this in two ways. You can use Fragments or Activities for each layout. If you implement fragments, I suggest reading http://developer.android.com/guide/components/fragments.html inside there you will about using the FragmentActivity instead of the Activity. Read this link http://developer.android.com/tools/extras/support-library.html as it will have the needed libraries to implement the Fragments in older versions of the SDK. It does looks like you looking for some navigation buttons that reside on the bottom of the layout. In order to fully implement a layout that has this view on the bottom of the screen in SDK 8, you will need to create your own View and place it on the bottom of the screen. RelativeLayout and alignParentBottom = "true" will accomplish this. There is also a way to do this using a ViewPager which will also work in the backwards compatibility requirements you have. I am sorry the amount of information I am throwing at you but I really would recommend looking into other questions posted by users on this topic. How to navigate to another page in android? for example. Good luck and everything you are looking for is able to be learned through a Google search. Maybe not all at once.

Related

Proper way to to show chords and lyrics in Android app using a textview

I have made a simple Kotlin app which is used to see lyrics and chords together.
I made a textview and set it as per requirements, but the problem is that I could not show chords in the lyrics properly.
This is the current status of my app, while this is an example of what I'm trying to achieve.
In the first image, I can edit the content but the ending result is not good.
In the second image, which is taken from another app, the ending result is nice, and every chord is clickable too.
How can I achieve the same in Kotlin or in Java? How can I make it clickable for a single letter within a textview?
How to put chords in proper way?
Please help me.

"Fold-out" for row in RecyclerView

Java 8, min SDK: 24, target SDK: 27
My app displays a map with some type of map marker (within a Fragment) and if I click on one of these markers, a popup comes up to show some additional information about this marker. Currently I'm using a normal AlertDialog for that but I might replace it with a DialogFragment in the future.
Inside the dialog there's a RecyclerView that is filled with multiple values. If I click on one of the rows, I want my app to open a "fold-out" underneath it (the other rows should move down) that displays even more information about that row. Clicking on the row again should close that "fold-out".
Similar to what the FoldingCell library does but I want to add to the original row (instead of replacing it) and also don't need the fancy animation.
Like this:
Is "fold-out" the right word for it? I'm pretty sure I saw a similar question here on Stackoverflow (might have been for iOS) a while back but I've not been able to find it again yet. I know how to do the whole onClick thing for the map and the RecyclerView but how do I accomplish the "fold-out" part (create design in xml, then load via Java class)?

What Box like view should I use?

I'm trying to create an app using Android Studio, and I want to use some type of expandable box, where I'll have an indefinite number shown like in a stack, and when clicking on the left side icon, the selected box opens up to show more info.
The basic idea of what I'm searching for:
Would anyone know about something like that??
Thanks in advance.
If I understand it well, what you're looking for is a recyclerview (for the indefinite number of row) and an accordion widget to open close your content.
I will suggest your to look at these projects:
https://github.com/hgDendi/ExpandableRecyclerView
https://android.jlelse.eu/get-expandable-recyclerview-in-a-simple-way-8946046b4573
which present all requirements you need.
And here is an similar question/answer : https://stackoverflow.com/a/10313432/6809926
The google search I made : android accordion recyclerview example.

Android Studio - Scrolling page with multiple textviews

To help with the explanation of what I'm trying to do I'll use the example of twitter (RSS feed concept).
A single activity with multiple bodies of text that all move simultaneously on the page.
I understand how to use a scroll view, however this only allows for one scrolling body of text. What I'm seeking is all textviews to scroll collectively as I move up or down the page.
Thanks,
Aaron
This behaviour what you described is exactly the function of a ListView . If you never used it before, take a look at this tutorial for example: http://androidexample.com/Create_A_Simple_Listview_-_Android_Example/index.php?view=article_discription&aid=65&aaid=90

WebView with ViewFlipper w/ one website

I have some html files on my server that are displayed using a WebView. The html files are quite lengthy, meaning they have a lot of text (for example one is a copy of the US Constitution). Instead of letting the user simply scroll down the WebView to display the rest of the HTML file I was wondering if there is some way I could use ViewFlipper to "flip" to the next section of the HTML file's text. Basically what I mean is instead of scrolling, you "flip" the WebView content to view the rest of it. I am not sure if this is even possible and I apologize if what I am trying to do is not clear with my question. I appreciate any help or approaches to take or ideas on how one could do this. Thanks.
I'm using this two library. both are free and opensource.
TurnJs
Booklet
I think this is only possible in case of responsive website's only.
Other websites can't able to scroll because the minimum Desktop resolution screen is 1024 * 768. where as in case of mobile it is as low as 240 * 320 and it goes up to 5 inch , up to 10 inch in case of tablet.

Categories

Resources