Ibrahim Ali Ibrahim Ali - 1 year ago 68
JSON Question

ConstraintLayout content shape changed if scrolled

I used constarintLayout as a container for my

recycleView
, And i fill my items by depend on json (Retrieved data).

So i makes some tricks here, If my retrieved json contain a specific value i have to make some items in my constraint layout to disappear and resize others.

All work fine, But when i scroll down and scroll up, The changed value back to old statue i don't need.

for ex:
this marked row have different customize shape
enter image description here

when scroll down and scroll up again the row lost the modified shape :
enter image description here

Here is my constraintLayout.xml:

<android.support.constraint.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="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="20dp"
android:clickable="true"
android:focusable="true"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingBottom="8dp"
android:paddingTop="8dp"
app:layout_constraintLeft_toRightOf="@+id/article_subtitle"
tools:layout_editor_absoluteY="27dp"
android:id="@+id/containerDetailsItem">


<TextView
android:id="@+id/technicalName"
style="@style/TextAppearance.AppCompat.Subhead"
android:layout_width="141dp"
android:layout_height="wrap_content"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:gravity="right"
android:maxLines="1"
android:paddingLeft="5dp"
android:textColor="@color/white"
android:textSize="@dimen/text_main"
app:layout_constraintRight_toLeftOf="@+id/thumbnailLayout"
app:layout_constraintTop_toTopOf="parent" />


<TextView
android:id="@+id/technicalProfile"
style="@style/TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginTop="30dp"
android:background="@color/white"
android:drawableRight="@drawable/account_circle"
android:gravity="center"
android:maxLines="1"
android:text="الملف الشخصي"
android:padding="4dp"
android:textColor="@color/background"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintHorizontal_weight=".1"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/technicalAge"
app:layout_constraintTop_toTopOf="parent" />

<TextView
android:id="@+id/technicalExperince"
style="@style/TextAppearance.AppCompat.Body1"
android:layout_width="137dp"
android:layout_height="wrap_content"
android:layout_marginRight="19dp"
android:layout_marginTop="0dp"
android:maxLines="1"
android:textColor="@color/white"
app:layout_constraintRight_toLeftOf="@+id/thumbnailLayout"
app:layout_constraintTop_toBottomOf="@+id/technicalExperince" />

<TextView
android:id="@+id/technicalAge"
style="@style/TextAppearance.AppCompat.Body1"
android:layout_width="139dp"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
android:layout_marginRight="17dp"
android:layout_marginTop="2dp"
android:foregroundGravity="right"
android:gravity="right"
android:maxLines="1"
android:textColor="@color/white"
app:layout_constraintBottom_toTopOf="@+id/technicalExperince"
app:layout_constraintHorizontal_weight=".2"
app:layout_constraintRight_toLeftOf="@+id/thumbnailLayout"
app:layout_constraintTop_toBottomOf="@+id/technicalName"
app:layout_constraintVertical_bias="0.0" />


<RelativeLayout
android:id="@+id/thumbnailLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="-36dp"
android:layout_marginRight="-1dp"
android:paddingBottom="5dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintRight_toRightOf="parent">

<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/thumbnail"
android:layout_width="75dp"
android:layout_height="75dp"
android:layout_marginRight="5dp"
android:layout_marginTop="0dp"
android:background="@drawable/unselected"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />

</RelativeLayout>




And here example for changed in layout items :

if (mCursor.getString(ArticleLoader.Query.TYPE).equals("2")) {
holder.ageView.setTypeface(font);
holder.ageView.setText("\uf0ce" + " office" );
holder.experinceView.setVisibility(View.GONE);
holder.nameView.setTextSize(23);

//holder.constraintView.setBackgroundColor(getResources().getColor(R.color.office_color));
}
if (mCursor.getString(ArticleLoader.Query.TYPE).equals("1")) {
holder.ageView.setTypeface(font);
holder.ageView.setText( "\uf19c" + " company" );
holder.experinceView.setVisibility(View.GONE);
holder.nameView.setTextSize(23);
//holder.constraintView.setBackgroundColor(getResources().getColor(R.color.company_color));
}


So i edit this data only if retrieved data called
type
equal to a specific value.

And if
type
not equal to specific
type
i let it appear in a normal shape.

My adapter :

private class Adapter extends RecyclerView.Adapter<ViewHolder> {


public Adapter(Cursor cursor) {
mCursor = cursor;
}

@Override
public long getItemId(int position) {
mCursor.moveToPosition(position);
return mCursor.getLong(ArticleLoader.Query._ID);
}


@Override
public ViewHolder onCreateViewHolder(final ViewGroup parent, int viewType) {

View view = getLayoutInflater().inflate(R.layout.list_item_profiles_vertical, parent, false);
final ViewHolder vh = new ViewHolder(view);
view.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
startActivity(new Intent(Intent.ACTION_VIEW,
ItemsContract.Items.buildItemUri(getItemId(vh.getAdapterPosition()))));
try {

int i = Integer.parseInt((String) mCursor.getString(ArticleLoader.Query.SERVER_ID));
Log.i(TAG, "bindViews: " + i);
i = i + 1;
Config.BASE_URL = new URL("http:/json/users?user=" + mCursor.getString(ArticleLoader.Query.SERVER_ID));
startService(new Intent(DisplaysActivity.this, CurrentService.class));
Log.i(TAG, "onCreateDisplay: " + mCursor.getString(ArticleLoader.Query.SERVER_ID));
Log.i(TAG, "onClick: " + Config.BASE_URL);
} catch (MalformedURLException e) {
e.printStackTrace();
}

}
});
return vh;
}

@Override
public void onBindViewHolder(ViewHolder holder, int position) {

holder.ageView.setTypeface(typeface);
mCursor.moveToPosition(position);
holder.nameView.setText(mCursor.getString(ArticleLoader.Query.NAME));
if (mCursor.getString(ArticleLoader.Query.TYPE).equals("2")) {
holder.profileIcon.setTypeface(font);
holder.ageView.setTypeface(font);
holder.ageView.setText(" مكتب" );
holder.ageView.setTextSize(17);
holder.profileIcon.setText("\uf0f7");
holder.experinceView.setVisibility(View.GONE);
holder.nameView.setTextSize(23);
//holder.constraintView.setBackgroundColor(getResources().getColor(R.color.office_color));
}
if (mCursor.getString(ArticleLoader.Query.TYPE).equals("1")) {
holder.profileIcon.setTypeface(font);
holder.ageView.setTypeface(font);
holder.ageView.setText(" شركة");
holder.ageView.setTextSize(17);
holder.profileIcon.setText("\uf0f7");
holder.experinceView.setVisibility(View.GONE);
holder.nameView.setTextSize(23);
//holder.constraintView.setBackgroundColor(getResources().getColor(R.color.company_color));
}
if (mCursor.getString(ArticleLoader.Query.TYPE).equals("3")){
holder.profileIcon.setVisibility(View.GONE);
holder.ageView.setTypeface(typeface);
}

if (mCursor.getString(ArticleLoader.Query.TYPE).equals("3") && mCursor.getString(ArticleLoader.Query.STATUE).equals("1")){
holder.ageView.setText(mCursor.getString(ArticleLoader.Query.AGE) + " سنة" + " / " + "متاح ");
}else if(mCursor.getString(ArticleLoader.Query.TYPE).equals("3") && mCursor.getString(ArticleLoader.Query.STATUE).equals("0")){
holder.ageView.setText(mCursor.getString(ArticleLoader.Query.AGE) + " سنة" + " / " + "غير متاح ");
}else if (mCursor.getString(ArticleLoader.Query.TYPE).equals("3")){
holder.ageView.setText(mCursor.getString(ArticleLoader.Query.AGE) + " سنة");
}

// holder.dateView.setText(DateUtils.getRelativeTimeSpanString(
// mCursor.getLong(ArticleLoader.Query.PUBLISHED_DATE),
// System.currentTimeMillis(), DateUtils.HOUR_IN_MILLIS,
// DateUtils.FORMAT_ABBREV_ALL).toString() + "قبل");
holder.experinceView.setText(mCursor.getString(ArticleLoader.Query.EXPERINCE) + " سنوات خبرة" + " / " + mCursor.getString(ArticleLoader.Query.CITY));
if (mCursor.getString(ArticleLoader.Query.THUMB_URL).length() > 5) {
Picasso.with(getApplicationContext()).load(mCursor.getString(ArticleLoader.Query.THUMB_URL)).into(holder.thumbnailView);
} else {
Picasso.with(getApplicationContext()).load("http:logo.png").into(holder.thumbnailView);
}


holder.nameView.setTypeface(typeface);

holder.experinceView.setTypeface(typeface);
holder.technicalProfile.setTypeface(typeface);

}

@Override
public int getItemCount() {
if (mCursor.getCount() < 1){
Toast.makeText(DisplaysActivity.this, "لا يوجد محتوى", Toast.LENGTH_SHORT).show();
}
return mCursor.getCount();
}
}


This worked fine but my problem with scroll, if i scroll down and scroll up again the changed item effect gone,
is this a bug or what ?

Answer Source

I think that the issue is with your views that you are making gone. Views are recycled so, let's say that view #12 is set so that an image is set to gone. Let's also say that #12 is recycled to display a different row from your database and that row requires the image to be visible or not gone. The image in view #12, since it was recycled, is still gone unless you explicitly make it visible. In other words, all information in a recycled view remains unchanged until you change it. That goes for data and any view attributes. It is easy to remember to change the data but not the view attributes.

I suggest that you add code to explicitly make a view visible if it needs to be visible.

Try your onBindViewHolder() with the following initial two lines to see if it helps:

holder.experinceView.setVisibility(View.VISIBLE);
holder.profileIcon.setVisibility(View.VISIBLE);
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download