Can't center Image in ImageView - android

So I've been struggling centring this button in my View for about 3 hours I've gave up and came here to ask for some advice from more experienced android developers.
For now it looks like this.
I would like to look something like this
My view looks like this in code:
<RelativeLayout
android:id="#+id/receptionLineAddQuantityAndSeries"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:paddingBottom="#dimen/padding_layout">
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_above="#+id/layoutQntInput"
local:MvxBind="Visibility Article.SeriesType, Converter=Visibility;">
<Mvx.MvxImageView
android:id="#+id/articleSeriesImage"
android:src="#drawable/ic_list_white_48dp"
android:layout_width="wrap_content"
android:scaleType="center"
android:paddingRight="#dimen/padding_layout"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_alignParentRight="true"
android:background="#drawable/button_border"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp" />
<RelativeLayout
android:id="#+id/layoutInputSeries"
android:paddingLeft="#dimen/padding_layout"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginRight="58dp">
<TextView
android:id="#+id/suppliersSearchInputLabelCode"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_alignParentTop="true"
style="#style/ExtendProTheme.EditTextLabel"
local:MvxBind="Visibility Article.SeriesType, Converter=Visibility; Text Article.SeriesType, Converter=ArticleSeriesTypeToLabel;" />
<CC.CustomEditText
android:id="#+id/inventoryIdentifyArticleEditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:theme="#style/ExtendProTheme"
android:maxLength="20"
android:layout_below="#+id/suppliersSearchInputLabelCode"
style="#style/ExtendProTheme.EditText"
local:MvxBind="Text Article.SeriesName, Mode=TwoWay; Error Errors['SeriesName']; Visibility Article.SeriesType, Converter=Visibility; Hint Article.SeriesType, Converter=ArticleSeriesTypeToHint; EnterCommand GetSeriesTotalQuantityCommand; FocusChangeCommand GetSeriesTotalQuantityCommand;" />
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
What i've tried so far is all the combination of
android:scaleType = fitXY, fitCenter, center, matrix
fixed widths for the ImageView, no results...
Any help would be nice.
I've tried all the answers below and they still didn't show as expected. I found a version that looks close to what i need .
<Mvx.MvxImageView
android:layout_width="48dp"
android:layout_height="match_parent"
android:src="#drawable/ic_list_white_48dp"
android:id="#+id/articleSeriesImage"
style="#style/ExtendProTheme.ListButtonSeriesStyle">
<style name="ExtendProTheme.ListButtonSeriesStyle">
<item name="android:scaleType">matrix</item>
<item name="android:paddingRight">#dimen/padding_layout</item>
<item name="android:layout_marginLeft">8dp</item>
<item name="android:layout_marginRight">8dp</item>
<item name="android:layout_marginTop">8dp</item>
<item name="android:background">#drawable/button_border</item>
<item name="android:layout_alignParentRight">true</item>
<item name="android:layout_gravity">center</item>
</style>

try this one :)
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:id="#+id/receptionLineAddQuantityAndSeries">
<Mvx.MvxImageView
android:id="#+id/articleSeriesImage"
android:src="#drawable/ic_list_white_48dp"
android:layout_width="60dp"
android:layout_height="match_parent"
android:scaleType="center"
android:paddingRight="#dimen/padding_layout"
android:gravity="center"
android:layout_alignParentRight="true"
android:background="#drawable/button_border"
android:layout_marginRight="15dp"
android:layout_centerVertical="true"/>
<TextView
android:id="#+id/suppliersSearchInputLabelCode"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
style="#style/ExtendProTheme.EditTextLabel"
local:MvxBind="Visibility Article.SeriesType, Converter=Visibility; Text Article.SeriesType, Converter=ArticleSeriesTypeToLabel;" />
<CC.CustomEditText
android:id="#+id/inventoryIdentifyArticleEditText"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="5dp"
android:theme="#style/ExtendProTheme"
android:maxLength="20"
android:layout_below="#+id/suppliersSearchInputLabelCode"
android:layout_toLeftOf="#+id/articleSeriesImage"
style="#style/ExtendProTheme.EditText"
local:MvxBind="Text Article.SeriesName, Mode=TwoWay; Error Errors['SeriesName']; Visibility Article.SeriesType, Converter=Visibility; Hint Article.SeriesType, Converter=ArticleSeriesTypeToHint; EnterCommand GetSeriesTotalQuantityCommand; FocusChangeCommand GetSeriesTotalQuantityCommand;" />
</RelativeLayout>

try this ,check for syntax
<RelativeLayout>
<TextView
id=#+id/yourtxtv
/>
<ImageView
android:layout_alignBaseline
android:align_right_to="#+id/yourtxtv"
android:margin_right=xxxx(put the value u want to put)
/>
</RelativeLayout>

This is what I tried and found:
<RelativeLayout
android:id="#+id/receptionLineAddQuantityAndSeries"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"/>
<ImageView
android:id="#+id/articleSeriesImage"
android:src="#drawable/ic_android"
android:background="#color/blue"
android:layout_width="wrap_content"
android:scaleType="center"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_alignParentRight="true"
android:layout_marginRight="16dp"
android:layout_marginTop="8dp" />
<RelativeLayout
android:id="#+id/layoutInputSeries"
android:paddingLeft="64dp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginRight="58dp">
<TextView
android:id="#+id/suppliersSearchInputLabelCode"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:text="sn"
android:layout_alignParentTop="true"/>
<EditText
android:id="#+id/inventoryIdentifyArticleEditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:theme="#style/ExtendProTheme"
android:maxLength="20"
android:layout_below="#+id/suppliersSearchInputLabelCode"/>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>

The solution was
<Mvx.MvxImageView
android:layout_width="48dp"
android:layout_height="48dp"
android:src="#drawable/ic_list_white_48dp"
android:id="#+id/articleSeriesImage"
style="#style/ExtendProTheme.ListButtonSeriesStyle">
<style name="ExtendProTheme.ListButtonSeriesStyle">
<item name="android:scaleType">matrix</item>
<item name="android:paddingRight">#dimen/padding_layout</item>
<item name="android:layout_marginLeft">8dp</item>
<item name="android:layout_marginRight">8dp</item>
<item name="android:layout_marginTop">8dp</item>
<item name="android:background">#drawable/button_border</item>
<item name="android:layout_alignParentRight">true</item>
<item name="android:layout_gravity">center</item>
</style>
It's the only way it worked . Thanks all for ideas.

Related

Not able to give space between hint and line inside texIinputLayout android

I am trying to give gap between hint and below line inside TextInputLayout ,In design it is showing gap if I include paddingBottom.But after running the app that gap is not reflecting.Below is my code.
<RelativeLayout
android:id="#+id/input_password_outer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/layout_country_text_fields"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp">
<android.support.design.widget.TextInputLayout
android:id="#+id/input_password"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<EditText
android:id="#+id/input_oldpwd_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Confirm New Password"
android:inputType="textPassword"
android:paddingBottom="25dp"
android:textColor="#color/registration_login_edit_text"
android:textSize="15sp" />
</android.support.design.widget.TextInputLayout>
<LinearLayout
android:layout_width="38dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginTop="10dp"
android:layout_weight="#dimen/password_eye_weight"
android:gravity="right|center_horizontal"
android:scaleType="fitXY">
<ToggleButton
android:id="#+id/confirm_password_toggle_button"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:background="#color/mobile_screen_background"
android:clickable="true"
android:gravity="right|center_horizontal"
android:padding="3dp"
android:textOff=""
android:textOn=""
/>
</LinearLayout>
</RelativeLayout>
You need to define specific style for TextInputLayout.
<android.support.design.widget.TextInputLayout
android:id="#+id/input_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/TextInputLayoutLabel" >
<EditText
android:id="#+id/input_oldpwd_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Confirm New Password"
android:inputType="textPassword"
android:textColor="#color/registration_login_edit_text"
android:textSize="15sp" />
</android.support.design.widget.TextInputLayout>
And inside res -> values --> style.xml. This will reflect Runtime.
<style name="TextInputLayoutLabel" parent="Widget.Design.TextInputLayout">
<!-- Hint color and label color in FALSE state -->
<item name="android:textColorHint">#android:color/black</item>
<item name="android:textSize">15sp</item>
<item name="android:paddingBottom">25sp</item>
</style>
EDIT 1
Here you can see the output at Runtime on my pixel emulator.

Spinner arrow color not changed

I have created a custom toolbar which has a spinner. I am trying to set a custom colour for the spinner arrow - currently the default is white, but it's not working, any ideas?
This is my Toolbar layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/newToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:elevation="0dp"
android:windowContentOverlay="#null"
android:orientation="horizontal">
<ImageView
android:id="#+id/strLogo"
android:layout_width="45dp"
android:layout_height="40dp"
android:layout_marginTop="13dp"
android:scaleType="fitCenter"
android:visibility="gone"
android:background="#ffffff"
android:src="#mipmap/logo"/>
<TextView
android:id="#+id/updateName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left|center_vertical"
android:layout_toRightOf="#+id/strLogo"
android:layout_centerVertical="true"
android:text="Test"
android:visibility="visible"
android:textColor="#ffffff"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textStyle="normal" />
<Spinner
android:id="#+id/spinner_nav"
android:layout_width="150dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
style="#style/customSpinnerTheme"
android:visibility="visible"/>
</RelativeLayout>
This my style xml for the spinner:
<style name="customSpinnerTheme" parent="ThemeOverlay.AppCompat">
<item name="colorControlActivated">#FFFFFF</item>
<item name="colorControlHighlight">#FFFFFF</item>
</style>
You can add this type of style in your spinner style and add your colors which you want to use as your drawable:
<style name="SpinnerAppTheme" parent="android:Widget.Spinner">
<item name="android:background">#drawable/apptheme_spinner_background_holo_light</item>
<item name="android:dropDownSelector">#drawable/apptheme_list_selector_holo_light</item>
</style>

Custom dialog becomes the size of the first control in android

I have the following layout for my custom log in dialog
<?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:padding="#dimen/padding_large">
<ImageButton android:src="#drawable/ic_settings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/dialog.login.settings"
android:padding="#dimen/margin_medium" />
<TextView android:text="#string/dialog.login.text.user_name"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<EditText android:id="#+id/dialog.login.user_name"
android:layout_width="match_parent"
android:gravity="center"
android:ems="20"
android:layout_height="wrap_content"
android:inputType="text"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView android:text="#string/dialog.login.text.password"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<EditText android:id="#+id/dialog.login.password"
android:layout_width="match_parent"
android:gravity="center"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:textAppearance="?android:attr/textAppearanceMedium" />
<CheckBox android:id="#+id/dialog.login.show_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/dialog.login.check.show_password"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_margin="#dimen/margin_medium"
android:checked="false" />
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button android:id="#+id/dialog.login.cancel"
android:drawableStart="#drawable/ic_exit_black"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginEnd="#dimen/margin_medium"
android:text="#string/dialog.login.button.cancel" />
<Button android:id="#+id/dialog.login.connect"
android:text="#string/dialog.login.button.connect"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_marginStart="#dimen/margin_medium"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
when I create the dialog and setcontentview the width of the dialog becomes equal to that of the image button on the first row
if I remove that , it becomes the size of the EditText (dialog.login.user_name) whose ems is 20
when I make the dialog's constructor call the base dialog constructor with a theme of R.style.Theme.Material.Dialog it does get the correct (about 3/4 of the screen) but the problem is that it ignores my primary and accent colours (which is normal)
Is there a way to have the dialog have the Theme.Material.Dialog size but still keep my own primary/accent colours?
thanks in advance for any help you can provide
After a lot of searching it seems that the solution is to actually replace the dialogTheme attribute of my main theme, so the solution was:
<style name="app.theme"
parent="android:Theme.Material.Light.NoActionBar.Fullscreen">
<item name="android:dialogTheme">#style/app.dialog</item>
......
</style>
<style name="app.dialog"
parent="android:Theme.Material.Light.Dialog">
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorPrimaryDark">#color/primary.dark</item>
<item name="android:colorAccent">#color/accent</item>
</style>

Push textview onto new line if too long

Not too sure how to word this but if you look at my picture below the blue of Victoria disappears off the screen but i'd like to to start a new line so you can clearly see the whole thing.
Heres my xml for for each list component. I have 5 textviews which are situated to the right of the preceding one, how can I pickup when one is too long for the line and move to another line?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/tube_stop_graphic1"
android:orientation="horizontal"
android:gravity="center_vertical|center_horizontal"
android:layout_width="25sp"
android:layout_height="25sp"
android:scaleType="fitXY"/>
<ImageView
android:id="#+id/tube_stop_graphic2"
android:orientation="horizontal"
android:gravity="center_vertical|center_horizontal"
android:layout_width="25sp"
android:layout_height="25sp"
android:scaleType="fitXY"
android:layout_below="#id/tube_stop_graphic1"/>
<ImageView
android:id="#+id/tube_stop_graphic3"
android:orientation="horizontal"
android:gravity="center_vertical|center_horizontal"
android:layout_width="25sp"
android:layout_height="25sp"
android:scaleType="fitXY"
android:layout_below="#id/tube_stop_graphic2"/>
<TextView
android:id="#+id/tube_stop_name"
android:orientation="horizontal"
android:paddingLeft="10px"
android:textSize="20sp"
android:text="BLABLA"
android:textStyle="normal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/tube_stop_graphic1"/>
<TextView
android:id="#+id/tube_stop_distance"
android:orientation="horizontal"
android:layout_alignParentRight="true"
android:gravity="right|center"
android:paddingRight="10px"
android:text="BLABLA"
android:textSize="14sp"
android:textStyle="normal"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#id/tube_stop_name"/>
<TextView
android:id="#+id/tube_line1"
style="#style/Tube_Stop_TextView"
android:text="Overgound"
android:layout_toRightOf="#id/tube_stop_graphic1"
android:layout_below="#id/tube_stop_name"/>
<TextView
android:id="#+id/tube_line2"
style="#style/Tube_Stop_TextView"
android:layout_toRightOf="#id/tube_line1"
android:layout_below="#id/tube_stop_name"/>
<TextView
android:id="#+id/tube_line3"
style="#style/Tube_Stop_TextView"
android:layout_toRightOf="#id/tube_line2"
android:layout_below="#id/tube_stop_name"/>
<TextView
android:id="#+id/tube_line4"
style="#style/Tube_Stop_TextView"
android:layout_toRightOf="#id/tube_line3"
android:layout_below="#id/tube_stop_name"/>
<TextView
android:id="#+id/tube_line5"
style="#style/Tube_Stop_TextView"
android:layout_toRightOf="#id/tube_line4"
android:layout_below="#id/tube_stop_name"/>
</RelativeLayout>
and the style for each of them
<style name="Tube_Stop_TextView">
<item name="android:gravity">center_vertical|center_horizontal</item>
<item name="android:paddingLeft">5sp</item>
<item name="android:paddingTop">5sp</item>
<item name="android:paddingBottom">5sp</item>
<item name="android:paddingRight">5sp</item>
<item name="android:textSize">10sp</item>
<item name="android:textStyle">normal</item>
<item name="android:background">#drawable/rounded_square</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:inputType">text</item>
</style>
It will be better if you wrap all your textviews in a gridview. Because your first TextView is having long text here. Gridview will push any view which is out of available width to a new row.

android textview not wrapping correctly

I have the following xml to display rows in a listView. I want the TextView with the id rowCreatedAt, to wrap around nicely but it never does and only shows 1 line. I tried most of the solutions in the other questions and added them in the code, but it still doesn't work. Can anyone tell me why...?
+I would like to avoid setting the exact size to the textview.
++ To put it differently, why does the rowCreatedAt textView doesn't wrap the text when width/height is set to fill_parent while other textViews wrap texts just fine?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_margin="5dp"
android:layout_marginBottom="5dp" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/rowUserImage"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="#drawable/twitter_icon"
android:layout_margin="5dp"/>
<TextView
android:id="#+id/rowCreatedAt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="10dp"
android:textColor="#ff696969"
android:ellipsize="none"
android:singleLine="false"
android:scrollHorizontally="false"
android:layout_weight="1"
android:maxLines="100"
android:text="aaaaaaaaaaaaaaabbbbbbbbbbbbbb" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/rowUserName"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="username"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/rowText"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="status text" />
</LinearLayout>
</LinearLayout>
<TextView
android:id="#+id/rowCreatedAt"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="10dp"
android:textColor="#ff696969"
android:ellipsize="none"
android:singleLine="false"
android:scrollHorizontally="false"
android:layout_weight="1"
android:maxLines="100"
android:text="aaaaaaaaaaaaaaabbbbbbbbbbbbbb" />
Change android:layout_width="fill_parent" to android:layout_width="200dp"
Try like this :
<TextView
android:id="#+id/Lesson_Description"
android:layout_width="300dp"
android:layout_height="wrap_content"
android:minLines="4"
android:maxLines="6"
android:gravity="right|center"
android:background="#drawable/filed_shape_corner"
android:inputType="textMultiLine" />
Then do something like in code :
mLessonDescription = (TextView) rootView
.findViewById(R.id.Lesson_Description);
mLessonDescription.setMovementMethod(new ScrollingMovementMethod());
Try out be setting android:ems="10" it will make your edittext that much wide and wraps the other characters.
OR
You should use android:ellipsize="marquee". If you do not want to fix the height.
Add the following style changes to fix the width problem. along with the initial changes
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:singleLine">false</item>
<item name="android:maxLines">100</item>
<item name="android:width">0dp</item>
<item name="android:layout_weight">1</item>

Categories

Resources