Android loading icon while getting data from Firestore - java

I'm getting data from Firebase Firestore to populate a ListView, and I would like to show a loading animation while the data is being fetched.

The code for layout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<RelativeLayout android:id="#+id/loading"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
xmlns:android="http://schemas.android.com/apk/res/android">
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:indeterminate="true" />
</RelativeLayout>
<ListView android:id="#+id/list_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
xmlns:android="http://schemas.android.com/apk/res/android" />
</FrameLayout>
The code in java
private void finishLoadList(){
RelativeLayout loadingLayout = (RelativeLayout) findViewById(R.id.loading);
ListView listView = (ListView) findViewById(R.id.list_view);
loadingLayout.setVisibility(View.GONE);
listView.setVisibility(View.VISIBLE);
}

Related

unable to scroll the screen which has grid view and listview below it

I have the following xml which has Gridview and framelayout below it.
My requirement is if I scroll the screen upwards whole screen should scroll, but for me Only listview scrolls
Below is the xml file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:focusableInTouchMode="true"
android:paddingBottom="#dimen/activity_vertical_margin">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/time_card_header"
android:id="#+id/scrollView">
<GridView
android:id="#+id/timecard_grid"
android:layout_width="match_parent"
android:layout_height="130dp"
android:layout_margin="3dp"
android:fitsSystemWindows="true"
android:gravity="center_horizontal"
android:horizontalSpacing="1dp"
android:numColumns="3"
android:stretchMode="columnWidth"
android:verticalSpacing="1dp" />
</ScrollView>
<FrameLayout
android:id="#+id/timecard_reports"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#color/white"
android:layout_below="#+id/scrollView"/>
</RelativeLayout
Actually GridView and Listview have already scroll. No need to put the above widgets in scrollview. Firstly, remove the scrollview. I think you need the FrameLayout to be fixed at the bottom and show gridview above. For that first use FrameLayout in the linear layout with align_parentbottom true. after that please place the gridview above FrameLayout. That will fix the problem.
Just put linearlayout below scroll view and then gridview.
<scrollview>
<linearlayout >
<gridview />
</linearlayout >
</scrollview>
Sorry i am giving the ans from the mobile but the concept is same.
You can use RecyclerView with GridLayoutManager and set nestedScrollingEnabled of recyclerView to false.
and instead of ScrollView use NestedScrollView as parent of RecyclerView:
private void setUpRecyclerView(View view) {
recyclerView = view.findViewById(id.repliesList);
recyclerView.setNestedScrollingEnabled(false);
recyclerView.setLayoutManager(new GridLayoutManager(getActivity(),numberOfColumns));
}
and xml file:
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScroll"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:focusableInTouchMode="true"
android:paddingBottom="#dimen/activity_vertical_margin">
<RecyclerView
android:id="#+id/timecard_grid"
android:layout_width="match_parent"
android:layout_height="130dp"
android:layout_margin="3dp"
android:fitsSystemWindows="true"
android:gravity="center_horizontal"
android:horizontalSpacing="1dp"
android:numColumns="3"
android:stretchMode="columnWidth"
android:verticalSpacing="1dp" />
<FrameLayout
android:id="#+id/timecard_reports"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:background="#color/white"
android:layout_below="#+id/scrollView"/>
</RelativeLayout
</android.support.v4.widget.NestedScrollView>

Android layout collapse

I use a XWalkView to load webpage and a IjkVideoView to play live video in my app. I want the IjkVideoView playing the video in front the XwalkView, so I put these two view in a relativelayout and IijVideoView behind the XWalkView.
In the android studio's Component Tree of Design window the layout seems ok as below image,
While when I run the app in my device, the layout is in mess as below image. You can see the background of IjkVieoView is in front of XWalkView, but the video playing in the IjkVideoView is behind the XWalkView, as the upper part of the video has been covered by the XWalkView.
layout xml,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="UselessParent">
<!-- This could be your fragment container, or something -->
<org.xwalk.core.XWalkView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/xWalkView"
android:layout_width="fill_parent"
android:layout_height="160dp"
android:background="#color/blue"
android:isScrollContainer="true">
</org.xwalk.core.XWalkView>
<com.xxxxxx.app.widget.media.IjkVideoView
android:id="#+id/video_view"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="72dp"
android:background="#color/colorAccent" />
<com.roughike.bottombar.BottomBar
android:id="#+id/bottomBar"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
app:bb_tabXmlResource="#xml/web_tabs" />
</RelativeLayout>
</LinearLayout>
activity java code,
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Log.d("INFO", "entered");
setContentView(R.layout.activity_web);
mXWalkView = (XWalkView) findViewById(R.id.xWalkView);
XWalkSettings webSettings = mXWalkView.getSettings();
webSettings.setJavaScriptEnabled(true);
mXWalkView.addJavascriptInterface(new JsInterface(), "NativeInterface");
videoView = (IjkVideoView) findViewById(R.id.video_view);
videoView.setAspectRatio(IRenderView.AR_ASPECT_FILL_PARENT);
videoView.setVideoURI(Uri.parse("http://live.xxxxxx.com/live/40xx27.flv"));
videoView.start();
final Bundle extras = getIntent().getExtras();
mXWalkView.load("http://xxxxxxxxxxxxxx", null);
}
Your layout seems to be correct. It might be broken from the libs. It already has 1k+ issues.
Maybe you can use a custom dialog that has the video in it and show that dialog. This way the video will be in front of the images. Then you can try to remove the shadow or bgColor = transparent, so that the user might not realise that is a dialog. This hack may work.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="UselessParent">
<!-- This could be your fragment container, or something -->
<org.xwalk.core.XWalkView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/xWalkView"
android:layout_width="fill_parent"
android:layout_height="160dp"
android:background="#color/blue"
android:elevation="5dp"
android:isScrollContainer="true">
</org.xwalk.core.XWalkView>
<com.xxxxxx.app.widget.media.IjkVideoView
android:id="#+id/video_view"
android:layout_width="200dp"
android:layout_height="200dp"
android:elevation="10dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="72dp"
android:background="#color/colorAccent" />
<com.roughike.bottombar.BottomBar
android:id="#+id/bottomBar"
android:layout_width="match_parent"
android:layout_height="60dp"
android:elevation="5dp"
android:layout_alignParentBottom="true"
app:bb_tabXmlResource="#xml/web_tabs" />
</RelativeLayout>
</LinearLayout>
Try this layout i modify it with elevation may it will help you.I have same problem by using elevation it solve.
I think it is due to relative layout. Why don't you try this code by using the Frame Layout. The most convenient and maintainable way to design application user interfaces is by creating XML layout resources. This method greatly simplifies the User Interface design process, moving much of the static creation and layout of user interface controls and definition of control attributes, to the XML, instead of littering the code.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<org.xwalk.core.XWalkView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/xWalkView"
android:layout_width="fill_parent"
android:layout_height="160dp"
android:background="#color/blue"
android:isScrollContainer="true">
</org.xwalk.core.XWalkView>
<com.xxxxxx.app.widget.media.IjkVideoView
android:id="#+id/video_view"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="72dp"
android:layout_gravity="Bottom"
android:gravity="center"
android:background="#color/colorAccent" />
<com.roughike.bottombar.BottomBar
android:id="#+id/bottomBar"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_alignParentBottom="true"
app:bb_tabXmlResource="#xml/web_tabs" />
</FrameLayout>
</LinearLayout>

Elements not going where they should in fragment XML

fragment_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/movies_fragment_ll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MoviesFragment">
<ListView
android:id="#+id/lvMovies"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#efefef"
android:layout_weight="100"/>
<Button
android:id="#+id/bLoadData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Load api data"
android:layout_weight="1"/>
</LinearLayout>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<include layout="#layout/fragment_main"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
onCreate from MainActivity.java
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
if (savedInstanceState == null) {
getSupportFragmentManager().beginTransaction()
.replace(R.id.movies_fragment_ll, new MoviesFragment())
.commit();
}
}
As you can see from the screenshot, the code is meant to display what's on the left, but what it's actually displaying is different. I've tried to play around with the XML and java but it keeps doing that. In some instances, depending on how I arrange the ListView and Button on the screen, I sometimes get two Buttons instead of one.
Why?
To clear the confusion.
Data is being added to the ListView.
Data is added on button click.
But before the button is clicked, and data is added to the ListView.
How do I make the ListView height finish just where the button starts at the bottom. To make the layout look like the one in the XML preview.
android preview shows a list with child.But at runtime you are not adding any element in the list view , so list view is empty . in that case your button moves to up.
if you want your button to stick in bottom use Relative layout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/movies_fragment_ll"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MoviesFragment">
<Button
android:id="#+id/bLoadData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Load api data"
/>
<ListView
android:id="#+id/lvMovies"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#efefef"
android:layout_above="#id/bLoadData"
android:layout_weight="100"/>
</RelativeLayout>
the list wont be visible if you dont have any data in that list. So that why the button will be shown on the top because listview's height will be 0.
Set some data to the list, and use relative layout to manage the location of the button at bottom
Well change it like This,and Please add some data to adapter
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/movies_fragment_ll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MoviesFragment">
<ListView
android:id="#+id/lvMovies"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:background="#efefef"
android:layout_weight="100"/>
<Button
android:id="#+id/bLoadData"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Load api data"
android:layout_weight="1"/>
</LinearLayout>

Footer with TextView

I'm updating an app someone made a couple of years back and I'm trying to add a footer visible all the time. I'm working on adding it on one of my activity, but here's the result:
Here is my .xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- Footer -->
<include layout="#layout/footer"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/footer">
<TextView
android:id="#+id/list_items"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="10dp"
android:textSize="22dp" >
</TextView>
</RelativeLayout>
And here's my line that calls it
setListAdapter(new ArrayAdapter<String>(this, R.layout.list_item, R.id.list_items, mRegions));
Thanks in advance!

alignParentBottom In a Layout Inflate

I have a ListActivity that I'm trying to inflate a Button from this layout file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<Button
android:id="#+id/add_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/add_prop"
android:layout_alignParentBottom="true"
/>
</LinearLayout>
Using this code:
View footer = getLayoutInflater().inflate(R.layout.footer, null);
ListView listView = getListView();
listView.setTextFilterEnabled(true);
listView.addFooterView(footer, null, false);
The problem is that since the list isn't so big that takes the entire screen (at least I think this is why) the button stays at the end of the list instead of sticking to the bottom because of the android:layout_alignParentBottom="true" property. What should I do to make it stick at the bottom?
You have to create a new layout file with this code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/add_button" />
<Button
android:id="#+id/add_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/add_prop"
android:layout_alignParentBottom="true" />
</RelativeLayout >
Then set it as content view of your Activity using setContentView()

Categories