I have problem with this:
As you can see the back icon is not correctly with the back text.
It needs to be little bit downwards.
I've tried:
to change the drawable image, resizing it.
padding but it is not useful for this condition
to switch to Button,Material button but nothing works fine.
Here is my code(Design code):
<TextView
android:id="#+id/textView6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="30dp"
android:layout_marginTop="20dp"
android:drawableStart="#drawable/ic_back"
android:text="Back"
android:textColor="#color/SkyBlue"
android:textSize="20sp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
I need like this:(See that mailbox button)
Note 1: This is just because my client have this kind of specific design.(IOS inspired).
Note 2: I know IOS design standards and android design are way different; also this design wont fit in android deign guidelines. But I can't do anything.
Related
So, the title may be confusing, but to put it in context:
I have an ImageButton component in my app display that should be on the opposite side of my ImageView, lined up perfectly, and to repeat this for any other item on the same list.
My question and doubt itself is how to do this when the ImageButton in this case is inside a LinearLayout while the ImageView is outside of it. Is there like a code line that can connect an outside element to a LinearLayout inside element.
Here's how my display looks:
item_contact.xml
The blue rectangle, being the LinearLayout, means everything inside belongs to it, but the call button looks to be the on the other side of the user pic, which is not inside the LinearLayout, which is what I wanted, the problem is this:
activity_main.xml
Each of the TextViews are above and below both the user picture and the call button, but because they both also belong to the LinearLayout, it's obvious it's because of the latter.
Now I tried fixing the problem by simply adding the user picture to the LinearLayout, which seems like the obvious answer, but I needed to be sure, because my call button isn't correctly aligned to the right:
<ImageView
android:id="#+id/iv_image"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginStart="16dp"
android:contentDescription="#string/todo"
android:src="#drawable/ic_baseline_person_24"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:ignore="ImageContrastCheck" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toEndOf="#id/iv_image"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0">
<TextView
android:id="#+id/tv_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="8dp"
android:paddingBottom="8dp"
android:textColor="#color/purple_700"
android:textSize="18sp"
android:textStyle="bold" />
<ImageButton
android:id="#+id/call_button"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:layout_marginStart="248dp"
android:background="#1072E1"
android:contentDescription="#string/call"
android:minWidth="48dp"
android:src="#android:drawable/stat_sys_phone_call" />
<TextView
android:id="#+id/tv_number"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="14sp" />
</LinearLayout>
My ImageButton's "right alignment" was only done with the manual positioning of the android:layout_marginStart which I set to 248dp by attempts. Surely there's a better way to do this, but I've yet to find a solution that works.
Lastly, there's also the aforementioned problem: I can't seem to fix the LinearLayout issue without having to backtrack the progress I've done and use new code lines or already existing ones to resolve the issue.
So:
How can I "connect" two components, one inside a LinearLayout and another not, with or without the use of constraints and/or RelativeLayouts, and do I really have to insert the outside component to the LinearLayout;
How can I forcefully align a component to the right without having to manually push it with margin inputs (attempts);
Is there a way to know exactly how to connect a component to another by using constraints accurately, so it repeats that process through the entire contact list?.
I would really like if someone could answer at least one of the listed questions or, even better, resolve one of the most developed questions, where I show some images of reference.
Maybe even a suited tutorial for my case in specific that explains the ways of designing the layout of an app.
If more information is needed, I will gladly help, and I'll also try to answer to every response I can get.
Also, in case you're curious, here's my last question about the same app (already resolved):
"[AppName] stopped working" when I try to run my app on an AVD emulator
(Keep in mind that the problem at hand in this question has barely anything to do with this one.)
I am having this weird behaviour in the images below only on any Google phone, old or new, does not matter it just appears mistakenly. The sad thing is that it appears as expected on the rest of all phones. The annoying thing is that it appears correctly in the design as it appears in the image but everyone knows design never reflect reality in xml, the other annoying thing is that it is so simple, the root is the CoordinatorLayout and the text is just in the root :/
Here is the xml code
<androidx.coordinatorlayout.widget.CoordinatorLayout(This layout is the )
android:layout_width="match_parent"
android:layout_height="match_parent"
app:touchListener="#{0L}"
>
.
.
.
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Some Text"
android:background="#color/color_primary"/>
Since this is a constraint layout, you should put start, end and top constraints for proper results.
Example code:
<androidx.coordinatorlayout.widget.CoordinatorLayout(This layout is the )
android:layout_width="match_parent"
android:layout_height="match_parent"
app:touchListener="#{0L}"
>
.
.
.
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:text="Some Text"
android:background="#color/color_primary"/>
Something like this in the proper format would work for you. Happy coding! :)
I am having trouble scaling my text size based on the user's device. I use constraint layout to constrain the TextViews. I found that autoTextSize could be used to automatically fit my text in the TextViews. However, when I run my code on an Emulator like BlueStacks, some texts are not scaled properly. Weirdly, some work but some do not, even though I am implementing it the same way.
This is an example of what it looks like: The register button is in a big font but other texts aren't
This is what it looks like on my layout Editor:
My code for the register button:
<TextView
android:id="#+id/register"
android:layout_width="0dp"
android:layout_height="0dp"
android:text="REGISTER"
app:autoSizeTextType="uniform"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="5:1"
app:layout_constraintEnd_toEndOf="#id/guideline3"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#id/guideline2"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.541" />
my code for the "up to 8 characters" text.
<TextView
android:id="#+id/req"
android:layout_width="0dp"
android:layout_height="0dp"
android:autoSizeTextType="uniform"
android:text="*up to 8 characters"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="7:1"
app:layout_constraintEnd_toEndOf="#+id/guideline5"
app:layout_constraintHorizontal_bias="0.0"
app:layout_constraintStart_toStartOf="#+id/guideline4"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.538" />
Am I misusing autoSizeTextType somehow?
Also, my "Enter Username" text is very small. I use EditText and implement it the same way I did for the other two texts. If there is anyway I can make the font size bigger to fit the layout size, please let me know.
your <TextView android:id="#+id/register" is using app:autoSizeTextType="uniform" attr, <TextView android:id="#+id/req" have android:autoSizeTextType="uniform" - note the difference app/android. try to consolidate this param, you should probably use app in both/all TextViews
note that setAutoSizeTextTypeWithDefaults was introduced in API 26, so when you use android: prefix then this attr will be respected only on 26+. using custom app: makes this attr usable for TextView (in fact TextViewCompat) on any OS version
in Android Studio above layout preview you have an option to switch "Device to preview" and also API version - try to change to some older (in this sample 25 at most, preferably lowest supported minSdkVersion) or newest OS version, IDE should catch and show differences in look
Use TextView params like this
android:autoSizeTextType="uniform"
android:autoSizeMinTextSize="12sp"
android:autoSizeMaxTextSize="100sp"
android:autoSizeStepGranularity="2sp"
You can check the official documentation for more info.
In Android I am trying to do a RelativeLayout in which I want to use layout_above on something that is aligned with layout_alignBaseline, but find that this is not working correctly.
Note: I tested with API levels 14, 15, and am going to check in 19 (latest) as soon as I get that installed, with the same result. By the way, I'm referring to appearance in Eclipse layout editing GUI - I haven't tested on a real device, but I assume it's supposed to be consistent...
My real layout is complicated but I have reduced it to this simple example:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:id="#+id/a"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="A"/>
<TextView
android:id="#+id/b"
android:layout_alignParentLeft="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#id/a"
android:text="B"/>
<TextView
android:id="#+id/c"
android:layout_alignParentLeft="true"
android:layout_above="#id/b"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="C"/>
</RelativeLayout>
With this layout, I would expect to see the letter A at bottom right (yes), the letter B at bottom left (yes), and the letter C immediately above the letter B. In fact, the letter C does not appear - it seems to have been positioned off the top of the view.
If you replace the layout_alignBaseline on B with layout_alignTop or alignBottom, because in this example A has the same font size, this does not change the appearance of A and B at all - but now C appears in the correct place.
My basic question is, why does this not work when using the baseline alignment? Is this a bug or am I doing something wrong?
Notes:
Obviously in this simplified example there is no reason to use layout_alignBaseline, but it is necessary in cases where the font sizes are not the same.
This is not an urgent problem because I have come up with a less neat way to achieve a similar layout. But I'd like to know for future reference why it doesn't work.
I did look at the related questions but didn't spot the answer.
This is easily the weirdest problem I've ever faced.
So today, I created a new Android Project. The first layout xml had just a textview that has the following properties (its inside a relative layout):
<TextView
android:id="#+id/textView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="124dp"
android:background="#80ffffff"
android:gravity="center_vertical"
android:text="Welcome"
android:textSize="48dp"
android:textStyle="bold" />
What I wanted was to have a textview that has text in its center. But the text STARTS from the center and goes out of screen towers the right side.
So I thought I must be doing something wrong. I went into one of my older projects (it was also open in eclipse). I opened an XML there, and shockingly, all the text there has also moved to the left (It starts from the center, rather than actually centering the text). It was fine yesterday. Here's the button:
<Button
android:id="#+id/gettingstarted"
android:layout_width="210dp"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/login"
android:layout_below="#+id/login"
android:layout_marginTop="10dp"
android:text="Getting Started"
android:textColor="#ffffff" />
I have no idea what happened. Why is the text no longer centered in buttons in all my projects? I'm in a really tough spot right now. Kindly help.
For your first problem try
android:gravity="center_vertical|center"
but for your text views in your all projects , it's a general question , maybe it's occured because of changing in your apps theme or projects styles