My splash screen is a layer-list drawable as background in app theme. Here is it:
background_splash.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/dark_blue"/>
<item android:top="100dp">
<bitmap
android:gravity="top"
android:src="#mipmap/img_logo"/>
</item>
</layer-list>
As you see, I place the logo with margin 100dp from the top. Then I try to do the same in my fragment layout:
fragment_start.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#mipmap/bg_create_account">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/img_logo"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="100dp" />
</RelativeLayout>
But the logo in the layout appears lower than logo on the splash screen. I thought, the problem is in the default margin of Activity. But if I set:
<dimen name="activity_horizontal_margin">0dp</dimen>
<dimen name="activity_vertical_margin">0dp</dimen>
Nothing still happens. I always see the "jump" of logo from top to down about 10-20 dp. How can I avoid it?
EDIT: My activity xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"/>
</LinearLayout>
EDIT 2: I tried to pick up the distance manually and if I set <item android:top="125dp"> (or 126dp) and leave android:layout_marginTop="100dp" I see no "jump". It means the difference is 25 or 26 dp, but where are they?
EDIT 3: according to answer from Bryan the issue exists only in Android 4.4(API 19) and above. To avoid it I overrode styles.xml in folder values-19 with:
<item name="android:windowTranslucentStatus">true</item>
It seems drawable that you use for the splash screen does not take into account the size of the status bar, but the Activity does. This is the ~25dp difference you are observing, though this height of ~25dp is not guaranteed to be the same on all devices.
Maybe the problem is in the ActionBarSize, try add this to the SplashScreen :
Without AppCompat
android:paddingTop="?android:attr/actionBarSize"
With AppCompat
android:paddingTop="?attr/actionBarSize"
Or if you want, (although may be considered a bad practice), you can set a negative padding in the Activity Layout using data binding :
android:paddingTop="#{-1 * ?android:actionBarSize}"
Related
I'm developing my first app in Android studio and I have some styles applied to it, and one of them is a gradient background but I want to limit it.
This is my actual view:
The graident goes from top to bottom perfectly, but I want the gradient to occupy 1/4 of the screen, how can I do it? I've been looking on the internet but I didn't find a solution. Up to the red line for example:
How can I do it?
This is my actual drawable:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<gradient
android:angle="-90"
android:startColor="#3cba92"
android:endColor="#e6e9f0"
/>
</shape>
</item>
</selector>
Rather than modifying your drawable, why don't create an empty layout which has height as 1/4th of the screen and background as your drawable.
The rest of your code will remain as it is and should have no background.
For example, this can be done easily using a constraint layout as follows.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:weightSum="1"
>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="250dp"
android:background="#drawable/background_gradient"
app:layout_constraintTop_toTopOf="parent"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
Note : You can set the height programatically by measuring the screen size and dividing it by 4.
I have two same screens, with a logo at the center of the screen.
However, one screen has statusbar height considered while the other one doesn't, so the position of the logo does not match between the two.
This is the code on xml.
screen 1
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/blue" />
<item
android:height="200dp"
android:width="200dp"
android:gravity="center"
android:drawable="#mipmap/ic_launcher_foreground">
</item>
</layer-list>
screen 2
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blue"
android:gravity="center">
<ImageView
android:layout_height="200dp"
android:layout_width="200dp"
android:layout_marginBottom = "39dp"
android:scaleType="centerCrop"
android:src="#mipmap/ic_launcher_foreground"/>
</LinearLayout>
I use galaxy s10, which has height of statusbar of 39dp.
Now I can manually set margin of 39 to match the position of the logo(like the code above), but that is only for one specific device(which is s10). I need to set the margin dynamically for different mobile devices.
How do I do this? and why does one screen integrates the status bar height while the other doesn't?
P.s. This is a react-native project.
Background information
When a user enters my Android application. They are first taken to LoginActivity. LoginActivity takes some time to load as it is also responsible for performing background sqlite migrations as well as other housekeeping tasks (this takes 500-1000ms).
Unfortunately, the user sees a blank screen during this entire time. As setContentView has not executed yet.
I am trying to remediate this problem by following the guides
https://android.jlelse.eu/launch-screen-in-android-the-right-way-aca7e8c31f52
https://www.bignerdranch.com/blog/splash-screens-the-right-way/
They tell me I need to create a background_splash.xml in drawables and point to it using a custom style with <item name="android:windowBackground">#drawable/background_splash</item>
Unfortunately I noticed that I am not able to control padding margin width height, gravity of my logo in drawables.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#color/gray"/>
<!-- cant control android:margin=... (my min API is 21) -->
<!-- cant control android:width=... (my min API is 21) -->
<!-- cant control android:height=... (my min API is 21) -->
<item>
<bitmap
android:gravity="center"
android:src="#mipmap/ic_launcher"/>
</item>
</layer-list>
My problem
How to properly achieve same behavior (or at least similar) as my current activity_login.xml file and convert that into a drawable?
My code
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.LinearLayoutCompat
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"
android:background="#color/material_red_500">
<!--***********************************************************
* Layout section: The login logo
************************************************************-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<android.support.v7.widget.AppCompatImageView
android:layout_centerInParent="true"
android:src="#drawable/image_symbol_lock"
android:scaleType="fitCenter"
android:layout_width="150dp"
android:layout_height="150dp"/>
</RelativeLayout>
<!--***********************************************************
* Layout section: The login button (facebook)
************************************************************-->
<android.support.v7.widget.AppCompatTextView
android:id="#+id/button_facebook"
android:paddingTop="28dp"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:paddingBottom="28dp"
android:background="#color/material_blue_500"
android:text="LOG IN"
android:textSize="32sp"
android:textColor="#color/white"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.v7.widget.LinearLayoutCompat>
You can create a layout_splash with your own design and in the Splash style only set a background color. So first you will see the background color and not the blank and next see the layout. You could do this with the login activity.
Here is my button image file from my drawable folder called ooo.png:
And that's how it looks like on the device:
As you can see the width height proportion changed. It's a bit wider than the original.
I need it to be looking the same though.
I don't understand what causes this stretching. Here is my xml-file:
<?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:orientation="vertical" >
<Button
android:id="#+id/button1"
style="#style/styleBtns"
android:layout_gravity="center_horizontal"
android:layout_marginTop="50dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
My styleBtns-part of the styles.xml:
<style name="styleBtns" >
<item name="android:background">#drawable/btns_abc</item>
</style>
And in my btns_abc I set the background to my image resource. Currently state pressed and the normal state are the same, I want to change that as soon as it works properly:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/ooo" android:state_pressed="true"></item>
<item android:drawable="#drawable/ooo"></item>
</selector>
Thanks !
I don't know the exact reason but for a solution if u don't have any text for button ,use ImageView will show the same drawable u have added.
So what I am trying to do is display background for list row element. I've created row layout and applied style :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout1" android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#style/product1" >
I've set style as:
<style name="product1">
<item name="android:background">#drawable/product1</item>
</style>
and product1.xml as :
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:android="http://schemas.android.com/apk/res/android"
android:src="#drawable/prod1"
android:antialias="true"
android:dither="true"
android:filter="false"
android:gravity="right"
android:scaleType="fitXY" />
where prod1.9.png is a nine patch set to be scalable top and left (so I want to have my image in right lower corner)
But the problem I am facing now is that icon is displayed in the corner while 9patch is not scaled left and up.
If instead of using style I put android:background=#drawable/prod1 then it scales but every row get ridiculously big. Any ideas?
I haven't verified this with your code, but the first thing that comes to mind is (assuming using 'android:background' instead of the style), instead of this on the row layout:
android:layout_height="fill_parent"
set a fixed height:
android:layout_height="30dp"
It's not as flexible, but it might suit your needs.