We Keep Coding

Need to show view above of seekbar at specific position android

I want to show seekbar with dashed line as per below images . This line will be display dynamically based on low/high value. I have attached below image.
I have achieved below image. Can you please help me in this?

Add your progress bar inside a constraint layout and have its width set to match the parent. Add two imageviews on top of it that have the dotted line as a resource. Add two vertical guidelines and restrict each imageview to the appropriate guideline. Set the percentage of the guidelines to be where you want each time on the progress bar and the views will move accordingly. You can programmatically change the percentage of the guidelines like so:
Guideline guideLineLeft = (Guideline) findViewById(R.id.your_left_guideline);
Guideline guideLineRight = (Guideline) findViewById(R.id.your_right_guideline);
ConstraintLayout.LayoutParams params = (ConstraintLayout.LayoutParams) guideLineLeft.getLayoutParams();
params.guidePercent = 0.10f; // 10%
guideLineLeft.setLayoutParams(params);
guideLineRight.getLayoutParams();
params.guidePercent = 0.90f; // 90%
guideLineRight.setLayoutParams(params);
UPDATE after comment:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="#+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintEnd_toStartOf="#+id/guideline"
app:srcCompat="#drawable/ic_divider_more" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="#+id/guideline2"
app:srcCompat="#drawable/ic_divider_more" />
<android.support.constraint.Guideline
android:id="#+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.21" />
<android.support.constraint.Guideline
android:id="#+id/guideline2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.80"/>
</android.support.constraint.ConstraintLayout>

ConstraintLayout applying margin bottom to a view, also applies it to the top of the view

I have a TextView, below it an EditText and below it another TextView. When I apply a bottom margin of 12 dp to the EditText, it's applied but it also applies to the top of the view. I don't know if this is the way ConstraintLayout works. marginTop works as expected.
https://i.stack.imgur.com/VEOUz.jpg

From what i can see in your attachment you are creating a vertical chain but you didn't restrain your "description" to the bottom. This could cause issues since the constraint layout doesn't know where the chain ends. make sure you add app:layout_constraintBottom_toBottomOf="parent" or whatever view you need as a bottom chain constraint on the description TextView.
I recreated your example and there is mirror margin for the edit text.
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name"
app:layout_constraintBottom_toTopOf="#id/editText"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_chainStyle="spread" />
<EditText
android:id="#+id/editText"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="edit text"
app:layout_constraintBottom_toTopOf="#+id/description"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/name" />
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Description"
android:textColor="#color/colorTextPrimaryLight"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#+id/editText" />
You can play around with the chainStyle to see which fits best your needs.

How to keep views from disappearing in wrap_content

I have a problem where a view of mine is disappearing in my RecyclerView when the layout of that view is wrap_content. The RecyclerView is match_parent both directions, and uses a LinearLayout that inflates the below xml file. Here is what each piece of the RecyclerView is supposed to look like:
And here is the XML for that:
<?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="wrap_content"
android:layout_margin="10dp">
<View
android:id="#+id/scheduleBlockColor"
android:layout_width="15dp"
android:layout_height="match_parent"
android:layout_alignBottom="#+id/scheduleBlockText"
android:background="#color/colorCougarRed" />
<RelativeLayout
android:id="#+id/scheduleBlockText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toEndOf="#id/scheduleBlockColor"
android:layout_toRightOf="#id/scheduleBlockColor"
android:paddingEnd="0dp"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:paddingStart="5dp">
<TextView
android:id="#+id/scheduleBlockTime"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:text="#string/schedule_block_time_default"
android:textSize="16sp" />
<TextView
android:id="#+id/scheduleBlockClassName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/scheduleBlockTime"
android:ellipsize="end"
android:padding="2dp"
android:singleLine="true"
android:text="#string/schedule_block_class_default"
android:textColor="#000000"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/scheduleBlockRoom"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/scheduleBlockClassName"
android:padding="2dp"
android:text="#string/schedule_block_room_default"
android:textSize="16sp" />
</RelativeLayout>
</RelativeLayout>
My question is, how do I keep that colored piece from disappearing when the RecyclerView loads? If I have the parent RelativeLayout above set to match_parent, it works fine. I've tried this answer, but haven't had the same success

It is because of the height set on the <View>. It gets messed up (even with match_parent) by the fact that it doesn't have content. Since the intention is to have a vertical stripe, you could anchor it to the top and bottom of the parent. You already are doing it for the bottom part (kind of, aligning it to the bottom of the text view container), so you only need to take care of the top anchoring:
<View
android:id="#+id/scheduleBlockColor"
...
android:layout_alignParentTop="true"
... />

Instead of padding using layout_margin inside your RelativeLayout.

How can i remove unnecessary top padding in cardview?

I managed to implement Cardviews in my app, but the cardview show an unnecessary padding in the top.
What i want to achieve is to get a header image like this :
Here's my cardview Layout file :
<android.support.v7.widget.CardView
android:id="#+id/programCardview"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="match_parent"
card_view:cardUseCompatPadding="true"
xmlns:card_view="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/programHeader"
android:layout_width="match_parent"
android:layout_height="160dp"
android:src="#drawable/createdprogramviewcard"/>
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp">
<TextView
android:id="#+id/programTitle"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:text="Programme d'endurance"
android:textSize="20sp"
android:textAlignment="center"/>
<TextView
android:id="#+id/objectif"
android:layout_below="#+id/programTitle"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Objectif : " />
<TextView
android:id="#+id/programObjectif"
android:layout_below="#+id/programTitle"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="6 séances"
android:layout_toRightOf="#id/objectif"/>
<TextView
android:id="#+id/programWorkouts"
android:layout_below="#+id/programTitle"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:textAlignment="textEnd"
android:layout_alignParentRight="true"
android:text="6 séances" />
</RelativeLayout>
</LinearLayout>
This is the code of the RecyclerView :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerViewPrograms"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v7.widget.RecyclerView>
I manage to change the attribute cardUseCompatPadding but that not affect the internal form of the cardview, it's just there to separate them.
Thanks in advance.

I found a solution for my problem by changing the height of the imageView to 130dp. Apparently since i made the with of the image to match_parent, i had to find the exact height that will suit the image inside the cardview without giving it some extra padding.

The situation is due to two reasons, the first is that the height property of the CardView is in match_parent or in a larger size than the components occupy and at the same time the gravity property of the layout is in center.
To fix it just set the gravity of the LinearLayout to center | fill or just to fill.

I used these below attributes and it works for me.
card_view:cardElevation="0dp"
card_view:cardMaxElevation="0dp"
Or you can just use MaterialCardView instead of legacy CardView

Moving an ImageView on Android

I'm trying to write an app to play Snakes and Ladders (this is the first app I've ever written, and i'm just doing it for fun...not for a course or commercial purposes or anything).
So my problem is, I want to move my ImageView of a player token from one square on the board to another square. I don't know how to do two things:
How can I place the imageview of the token on top of the board imageview in the layout?
How can I go about moving the token imageview itself by a certain % of the size of the board imageview? Is this possible or am I supposed to do this some other way?
I have classes written for the player, board and squares that all work fine. I just need to know what to do with the player's token. (I have tested it by displaying a toast message saying the player location every time I roll the die).
Here is the xml code for the layout:
<?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="match_parent"
android:layout_gravity="center"
android:background="#drawable/stripes_background"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_gravity="center"
android:layout_marginTop="0dp"
android:layout_weight="0.1"
android:orientation="horizontal" >
<Button
android:id="#+id/toGameListButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.00"
android:background="#drawable/alternate_button_background"
android:text="Quit"
android:textColor="#FFFFFF"
android:textSize="17sp" />
<Button
android:id="#+id/restartButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1.00"
android:background="#drawable/alternate_button_background"
android:text="Restart"
android:textColor="#FFFFFF"
android:textSize="17sp" />
</LinearLayout>
<TextView
android:id="#+id/textViewTurn"
android:layout_width="match_parent"
android:layout_height="0dip"
android:gravity="center"
android:layout_weight="0.1"
android:text="TextView set to Player&apos;s turn"
android:textColor="#FF9900"
android:textSize="19sp"
android:textStyle="bold" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="0dip"
android:layout_weight="0.7" >
<ImageView
android:id="#+id/game_board"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:contentDescription="Board"
android:src="#drawable/snakes_and_ladders_raw_board" />
<ImageView
android:id="#+id/green_indicator"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</FrameLayout>
<Button
android:id="#+id/rollButton"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_marginTop="10dp"
android:layout_weight="0.1"
android:background="#drawable/alternate_button_background"
android:text="Roll!"
android:textColor="#FFFFFF"
android:textSize="19sp" />
</LinearLayout>
Any advice is greatly appreciated. Let me know if I'm supposed to be more specific in my problem or anything.

How can I place the imageview of the token on top of the board
imageview in the layout?
You can simply put both ImageViews into a RelativeLayout and then make sure that the ImageView of the token is below (in code) the ImageView of the board.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/game_board"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:contentDescription="Board"
android:src="#drawable/snakes_and_ladders_raw_board" />
<!-- views below in code will be on top -->
<ImageView
android:id="#+id/green_indicator"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
How can I go about moving the token imageview itself by a certain % of
the size of the board imageview? Is this possible or am I supposed to
do this some other way?
You could access the board ImageView width property and animate the token ImageView accordingly.
ImageView board = (ImageView) findViewById(R.id.board);
ImageView token = (ImageView) findViewById(R.id.token);
// animates the token imageview to the right side by 50% of the boardimageviews width
token.animate().x(board.getWidth() / 2).setDuration(500);