I have a loading screen for my android app.
It's working ok if I only use background image or ProgressBar, but when I try to center both elements in the middle of the screen I get that:
So far my activityy_main.xml looks like that:
<?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="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/mainLayout"
tools:context="com.siconet.axa.MainActivity" >
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/axa_logo" />
<ProgressBar
android:layout_width="250px"
android:layout_height="250px"
android:indeterminate="true" />
</RelativeLayout>
<WebView
android:id="#+id/webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</RelativeLayout>
What I want to achieve is something like this:
Try this 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:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/mainLayout"
tools:context="com.siconet.axa.MainActivity" >
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ProgressBar
android:layout_width="250px"
android:layout_height="250px"
android:layout_centerInParent="true"
android:indeterminate="true" />
</RelativeLayout>
<WebView
android:id="#+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
Hope this helps you.
Try adding to your progressBar this line android:layout_centerInParent="true"
Try using centerInParent instead. Something like...
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_centerInParent="true" > // right here
But I think a better approach would be to just use a LinearLayout.Try the below 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:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/mainLayout" >
<LinearLayout
android:id="#+id/loadingPanel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent ="true"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/play"
android:layout_gravity="center_horizontal" />
<ProgressBar
android:layout_width="250px"
android:layout_height="250px"
android:background="#drawable/pause"
android:indeterminate="true" />
</LinearLayout >
<WebView
android:id="#+id/webView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:visibility="gone"/>
</RelativeLayout>
Take note of the different changes but this layout gives me the following ...
I don't see your ImageView in the second image so I centered them both. If you can explain where that should be then I can adjust this layout for that.
Try use Frame Layout instead of RelativeLayout in "loadingPanel"
Related
I wanted to create the guideline in my apps,but i found that this empty space is on top of my image, how do i delete it to let my image stay on the top?Below is my layout.xml code.
<?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"
tools:context=".InfoActivity">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<ImageView
android:id="#+id/slide1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/slide1"
android:contentDescription="firstslide" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="#string/HELLO"
android:id="#+id/textView" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Try adding this in your ImageView.
android:scaleType="fitStart"
Hope it helps.
I fixed it with android:scaleType="fitXY"
I was trying to use Scroll Layout in Android. I want my views to get scrolled vertically. But I could see only HorizontalScrollLayout. What do I do If I want Vertical?
Here is the Code
<?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent"
android:id="#+id/scrollView"
android:layout_centerVertical="true"
android:orientation="vertical"
android:background="#color/abc_input_method_navigation_guard">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_gravity="center_horizontal">
<ImageButton
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:src="#drawable/lion"
android:background="#color/abc_input_method_navigation_guard"
android:scaleType="fitXY"
android:padding="20dp"
android:id="#+id/image1" />
<ImageButton
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_gravity="center"
android:src="#drawable/lion"
android:background="#color/abc_input_method_navigation_guard"
android:scaleType="fitXY"
android:padding="20dp"
android:id="#+id/image2" />
</LinearLayout>
</HorizontalScrollView>
Can anyone suggest me the solution?
Just use ScrollView. Here is the docs, and here is sample.
Please look at into this for reference.
Sample code for Vertical ScrollView
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
// Here all child view like TextView, Button, ImageView, Layouts
</LinearLayout>
</ScrollView>
I am able to center my image horizontal, but not vertical.. any idea's what might cause this? It should be in the center of the screen. I have also tried android:layout_gravity="center_vertical" but doesn't seem to do the trick...
<?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="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/splash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/splash" />
</LinearLayout>
A LinearLayout does not allow this behavior. Try a RelativeLayout instead.
<?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="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/splash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/splash" />
</RelativeLayout>
Why do you need a LinearLayout at all? You can just use the ImageView with the scaleType=center
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/splash"
android:src="#drawable/splash"
android:scaleType="center" />
That's your whole xml...
You will have to use RelativeLayout for such behavior. I can't think of a good way to do it with LinearLayout. Additionally, you can try the Graphical Layout (depends on the editor you are using).
I used two images in invisible mode just for create space.
Try this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/fake"
android:layout_width="wrap_content"
android:layout_height="200dp"
android:src="#drawable/splash"
android:visibility="invisible" />
<ImageView
android:id="#+id/splash"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/splash" />
<ImageView
android:id="#+id/fake"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/splash"
android:visibility="invisible" />
</LinearLayout>
I want to create, what seems to be a simple layout, but I am having a few problems with it.
The layout consists of a header, body which is a webview, and a footer banner on bottom as seen on the attached sketch.
I need the webview to take all the remaining space between the header and footer.
I have tried this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:background="#drawable/back"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:id="#+id/banner"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:src="#drawable/banner" />
<WebView
android:id="#+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/bck"
android:layout_weight="2"
android:layout_gravity="center"/>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="4">
<com.mobclix.android.sdk.MobclixMMABannerXLAdView
android:id="#+id/banner_adview"
android:layout_width="320dip"
android:layout_height="50dip"
android:layout_gravity="center"
android:layout_alignParentBottom="true" />
</RelativeLayout>
Put all of them inside a RelativeLayout and in the webview use layout_below="#id/header_banner" and layout_above="#+id/footer_banner"
This will work for you:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/ddd"
android:orientation="vertical" >
<ImageView
android:id="#+id/banner1"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:src="#drawable/atm" />
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/webview1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
/>
<ImageView
android:id="#+id/banner2"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_weight="0"
android:src="#drawable/atm" />
</LinearLayout>
Greetings,
I have the following layout in Android. I'm trying to make it so the seekbar is displayed ontop of the image (I have some code that makes it visible and invisible(Or rather GONE).
I was wondering if anyone could tell me how to position it so that the seekbar goes over the imageview, therefore allowing the imageview to take up the entire screen.
Thanks
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<.imageOverlay android:id="#+id/surface"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_gravity="center" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<SeekBar
android:id="#+id/seekbar"
android:layout_width="100px"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:max="255"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/surfaceimage"
android:scaleType="fitXY"
/>
Got it working with the following - I added framelayout instead of linearlayout.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<.imageOverlay android:id="#+id/surface"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_gravity="center" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#+id/surfaceimage"
android:scaleType="fitXY"
/>
<SeekBar
android:id="#+id/seekbar"
android:layout_width="100px"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:max="255"/>
</FrameLayout>
</RelativeLayout>