Localization and language difference issue in android - java

I'll try to make this short, So I created this Bluetooth Connection app and everything works perfect in my phone but i noticed an awful problem when I tested it on my friend's phone.
the problem is I'm using Linearlayout and two different buttons with image background on it for each row which stands aside each other, the circle standing on the left side of the rectangle which is correct and that's how it works on my phone, but when it comes to my friend's phone which has a different Language ( Language and Input in android settings ) the circle is on the right side of the rectangle.
Please note that i already know the fact that this can be fixed if he change the phone language to English just like mine, But i'm looking for a solution which wouldn't cause any trouble for all type of costumers in my country with two different phone languages.
Well, How am i supposed to fix this ?
How it looks on my phone
How it looks on my friend's phone
<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"
android:padding="#dimen/activity_vertical_margin">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="200dp">
<Button
android:layout_width="75dp"
android:layout_height="70dp"
android:id="#+id/circle1"
android:background="#drawable/redcircle />
<Button
android:layout_width="75dp"
android:layout_height="70dp"
android:id="#+id/greenCircle"
android:background="#drawable/greencircle"
android:alpha="0"/>
</FrameLayout>
<Button
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_marginTop="5dp"
android:id="#+id/rect1"
android:text="Bluetooth Turn On / Off"
android:textStyle="italic"
android:textColor="#fdfdfd"
android:background="#drawable/rects"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_weight="1.4"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="150dp"
android:layout_height="70dp"
android:id="#+id/circle2"
android:background="#drawable/gomb"
android:layout_weight="1" />
<Button
android:layout_width="match_parent"
android:layout_height="60dp"
android:id="#+id/rect2"
android:textStyle="italic"
android:text="View paired Devices"
android:textColor="#fdfdfd"
android:enabled="false"
android:background="#drawable/rects"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="0.9">
<Button
android:layout_width="150dp"
android:layout_height="70dp"
android:id="#+id/circle3"
android:background="#drawable/gomb"
android:layout_weight="1" />
<Button
android:layout_width="match_parent"
android:layout_height="60dp"
android:id="#+id/rect3"
android:textStyle="italic"
android:textColor="#fdfdfd"
android:enabled="false"
android:text="Scan for new Devices"
android:background="#drawable/rects"
android:layout_weight="1" />
</LinearLayout>

Looks like your friend's phone is in a right-to-left language, and your app "supports" right-to-left. While supporting RTL is an admirable goal, sometimes it's not feasible.
You have a few different options here. The fastest/easiest for you is to disable RTL support from your app. Add this attr to the <application> tag in your AndroidManifest.xml:
android:supportsRtl="false"
Or, you could try to actually provide the necessary support for RTL within your app. In this case, that probably means specifying an alternative drawable for your button background. If you currently have these:
res/drawable-mdpi/background.png
res/drawable-xhdpi/background.png
res/drawable-xxhdpi/background.png
You'd need to add these:
res/drawable-ldrtl-mdpi/background.png
res/drawable-ldrtl-xhdpi/background.png
res/drawable-ldrtl-xxhdpi/background.png
And you'd put the curvature on the right side of the button instead of the left.

Related

Can't fully hide android material card background

Image how it looks
Can't fully hide android material card background. I have searched and watched all videos available but nothing has worked so far. I know I could just put something to fill the card but I want to know just in case.
The code:
<com.google.android.material.card.MaterialCardView
android:id="#+id/card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="#40000000"
android:clickable="true"
app:cardCornerRadius="30dp"
android:layout_margin="10dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Planner"
android:textAlignment="center"
android:textColor="#color/white"
android:textSize="20sp"
android:fontFamily="#font/nova_bold"/>
<ImageView
android:layout_width="150dp"
android:layout_height="130dp"
android:layout_marginStart="10dp"
android:layout_marginTop="30dp"
android:padding="1dp"
app:srcCompat="#drawable/ic_plan_vec" />
</com.google.android.material.card.MaterialCardView>
please use in your XML app:cardBackgroundColor="#color/yourColor"
or in your java code card.setCardBackgroundColor(YourColor); instead of the default setBackgroundColor()
UPDATE
for the opacity change android:backgroundTint="#40000000" by android:alpha="0.4"

Designing Android App UI for Tab and mobile

I am working on new app in which I have to take care of design over mobile devices and tablets.I already read on SO that for this thing I need to create several buckets for sizes to avoid bad look of app on larger or smaller screen at the same time. here is the code I am working on
[![<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_width="match_parent"
android:layout_margin="35dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/lblLogo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:autoSizeTextType="uniform"
android:gravity="center"
android:padding="15dp"
android:text="My App Name"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#color/colorPrimaryDark"
android:textSize="32sp" />
<!-- Email Label -->
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/tilLoginEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/etLoginEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Email"
android:inputType="textEmailAddress" />
</com.google.android.material.textfield.TextInputLayout>
<!-- Password Label -->
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/tilLoginPassword"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/etLoginPassword"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:inputType="textPassword" />
</com.google.android.material.textfield.TextInputLayout>
<com.google.android.material.button.MaterialButton
android:id="#+id/btnLogin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:padding="12dp"
android:text="#string/btnLogin" />
</LinearLayout>
]
This is how the above code looks like on mobile phone (i.e Nexus 6)
**This is how the above code looks like on tablet (i.e Nexus 10)
Notice that on tablet is looking so bad. I know how to handle design in different design buckets. but I want to check if there is any
other solution without replicating the same design file in different
screen sizes buckets
Thanks in advance......
Instead of duplicate the layout try to:
avoid to hardcode the dimension in the layout.
use a ConstraintLayout
use the different qualifiers
For example the margin in your root view:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="#dimen/login_layout_margin"
android:layout_marginEnd="#dimen/login_layout_margin"
android:layout_gravity="center"
android:orientation="vertical">
<TextView
android:id="#+id/lblLogo"
..>
</LinearLayout>
Then create different dimension in different folder:
res/values/dimens.xml:
<dimen name="login_layout_margin">35dp</dimen>
res/values-sw600dp/dimens.xml:
<dimen name="login_layout_margin">350dp</dimen>
More details here.

How to put a TextView resize depending on the resolution of Android

I have a problem here , i just getting starter with android Development , i was just in Windows Phone , and when i put in WP some TextView in my screen , he will be the same way in other screens , but in android is not .I want to know if have some code in XML who i can define the position and not change!
Here is my XML
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".Home"
android:background="#drawable/background">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Recife +"
android:textSize="40dp"
android:textColor="#android:color/white"
android:layout_marginTop="40dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:fontFamily=""
android:id="#+id/textView" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Horários, Rotas e Informações"
android:textSize="25dp"
android:textColor="#android:color/white"
android:layout_marginTop="100dp"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:autoText="false" />
<Button
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="250dp"
android:background="#drawable/trem"
android:id="#+id/butaoMetro"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="#+id/button"
android:layout_below="#+id/butaoMetro"
android:layout_alignEnd="#+id/textView" />
How can i fix this?thanks!
I think this library autofit-textview can help you.
But you will need to wrap it into a custom FrameLayout nammed AutiFitLayout. Take a look at the example.
The problem here is
android:textSize="25dp"
set fixed for any resolution devices. For proper display you need to create layout for various resolution devices. For this you need to create different layout folder for different resolution devices and match according to it. Hope this helps

Android : Text in ForeGround of a FrameLayout (contain a googleMap)

Hello everyone
To start, sorry for my bad english
I first put you in position:
I'm using Java code for Android, in Eclipse.
My application needs to show a map (Google Maps V2) in a fragment to show the runner location. The map display is already achieved.
Here is my problem: I use a FrameLayout element, which contains my map and is therefore the whole page, however, my goal is to display over the map a text box centered at the bottom. I tried to use in the Foreground property option to set my text, but it does not work (application crash when arrived on the page of the map).
Here is my code fragment_carte:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/mapFrameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:foreground="#id/txtViewCoureur"
tools:context=".CarteFragment" >
</FrameLayout>
I can't post an image to show you what I want because it's my first post
I tried many solutions on this forum before asking my question
Thank you for your help!
Enclose the map inside a RelativeLayout and the rest of the controls in a FrameLayout. Here is an example of one app I have:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<fragment
android:id="#+id/mapview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
class="MapFragment" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/activity_vertical_margin"
android:layout_marginLeft="#dimen/activity_horizontal_margin"
android:layout_marginRight="#dimen/activity_horizontal_margin"
android:layout_marginTop="#dimen/activity_vertical_margin" >
<EditText
android:id="#+id/mapsearchbox"
android:layout_width="match_parent"
android:layout_height="40dp"
android:alpha="0.8"
android:background="#android:color/white"
android:hint="#string/map_search"
android:imeOptions="actionSearch"
android:inputType="text"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="30dp"
android:singleLine="true"
android:textColor="#android:color/black" >
</EditText>
<Button
android:id="#+id/mapsearchbtn
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="right|center_vertical"
android:layout_margin="8dp"
android:background="#android:drawable/ic_menu_close_clear_cancel" />
</FrameLayout>
</RelativeLayout>

Android ScrollView overscroll indicator Issue

This is a strange issue I'm having with my Samsung GT-I9003L. I've a ScrollView containing a LinearLayout with different stuff inside (ImageView, Button, EditText, etc.) and it works perfectly when tested in the emulator, both in 2.3.3 and 4.2 versions.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scroll_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="16dp" >
<ImageView
android:id="#+id/image"
android:layout_width="fill_parent"
android:layout_height="200dp"
android:contentDescription="#string/img_description"
android:src="#drawable/ic_launcher" />
<Button
android:id="#+id/btn_camera"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/add_new_btn_camera" />
<Button
android:id="#+id/btn_gallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/add_new_btn_gallery" />
<EditText
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/add_new_name_hint"
android:inputType="text"
android:maxLength="80" />
[...]
</LinearLayout>
</ScrollView>
The thing is that when I test it on my phone, the overscroll indicators (the blue/orange glows) doesn't show at all. I've managed to get them working with this line:
ScrollView addNewScroll = (ScrollView)findViewById(R.id.scroll_view);
addNewScroll.setOverScrollMode(ScrollView.OVER_SCROLL_IF_CONTENT_SCROLLS);
But when I reach the top or the end, the glow just "appears", it doesn't animates or fades in.
Thanks in advance for your help!
We are having the exact same issue. Overscolling doesn't seem to work on Samsung Galaxy 2 (Touchwiz), but also on HTC One X phones (older HTC's seem to work).
Is suspect that they replaced the ScrollView implementation with their own, maybe for the stretchy scrollbars or something.

Categories