Segmented control in Android
I have achieved it using build in Views.
MySegmentActivity
public class SegmentActivity extends AppCompatActivity implements View.OnClickListener {
private Context mContext;
private List<Button> buttonList = null;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.item_segment_layout);
mContext = SegmentActivity.this;
initSegmentButtons();
}
private void initSegmentButtons() {
buttonList = new ArrayList<>();
Button dayBtn = (Button) findViewById(R.id.btn_day);
Button weekBtn = (Button) findViewById(R.id.btn_week);
Button monthBtn = (Button) findViewById(R.id.btn_month);
dayBtn.setOnClickListener(this);
weekBtn.setOnClickListener(this);
monthBtn.setOnClickListener(this);
buttonList.add(dayBtn);
buttonList.add(weekBtn);
buttonList.add(monthBtn);
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.btn_day:
buttonList.get(0).setBackgroundResource(R.drawable.btn_bg_orange_selected);
buttonList.get(1).setBackgroundResource(R.drawable.btn_bg_orange);
buttonList.get(2).setBackgroundResource(R.drawable.btn_bg_orange);
break;
case R.id.btn_week:
buttonList.get(0).setBackgroundResource(R.drawable.btn_bg_orange);
buttonList.get(1).setBackgroundResource(R.drawable.btn_bg_orange_selected);
buttonList.get(2).setBackgroundResource(R.drawable.btn_bg_orange);
break;
case R.id.btn_month:
buttonList.get(0).setBackgroundResource(R.drawable.btn_bg_orange);
buttonList.get(1).setBackgroundResource(R.drawable.btn_bg_orange);
buttonList.get(2).setBackgroundResource(R.drawable.btn_bg_orange_selected);
break;
default:
break;
}
}
}
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="wrap_content"
android:layout_marginLeft="@dimen/activity_horizontal_margin"
android:layout_marginRight="@dimen/activity_horizontal_margin"
android:orientation="horizontal">
<Button
android:id="@+id/btn_day"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/btn_bg_orange"
android:gravity="center"
android:text="Day"
android:textColor="@android:color/white"
android:textSize="20sp" />
<Button
android:id="@+id/btn_week"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="-1dp"
android:layout_marginRight="-1dp"
android:layout_weight="1"
android:background="@drawable/btn_bg_orange"
android:gravity="center"
android:text="Week"
android:textColor="@android:color/white"
android:textSize="20sp" />
<Button
android:id="@+id/btn_month"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/btn_bg_orange_selected"
android:gravity="center"
android:text="Month"
android:textColor="@android:color/white"
android:textSize="20sp" />
</LinearLayout>
btn_bg_orange.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke
android:width="1dp"
android:color="@color/orange" />
<solid android:color="@android:color/transparent" />
</shape>
btn_bg_orange_selected
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke
android:width="1dp"
android:color="@color/orange" />
<solid android:color="@color/orange" />
</shape>
What you are looking for is MaterialButtonToggleGroup, and you can put in some Material Button. It is pretty similar to iOS UISegmentContorol.
It looks like this:
source with example: https://material.io/develop/android/components/buttons#toggle-button