Simple way to customize DialogFragment.
Add maven jitpack.io and dependencies in build.gradle (Project) :
// build.gradle project
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
// build.gradle app/module
dependencies {
...
implementation 'com.github.gzeinnumer:EasyDialogFragment:version'
implementation 'com.github.gzeinnumer:SimpleMaterialStyle:last-version'
//check last version on https://github.com/gzeinnumer/SimpleMaterialStyle
}- DialogFragment (docs)
Add This Line to res/color.xml. Important
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#6200EE</color>
<color name="colorPrimaryDark">#3700B3</color>
<color name="colorAccent">#03DAC5</color>
</resources>- Dialog View
dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="@+id/dialog_canvas"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
android:gravity="center"
android:orientation="vertical">
<TextView
android:text="You can use your widget here"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
</LinearLayout>- Create Class
CustomMyLibDialogExtendsMyLibDialogto your customDialogFragment. and inflate youlayoutononCreateView
CustomMyLibDialog.java
public class CustomMyLibDialog extends MyLibDialog {
public static CustomMyLibDialog newInstance() {
return new CustomMyLibDialog();
}
public CustomMyLibDialog() {
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
return inflater.inflate(R.layout.dialog, container, false);
}
@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
}
}- Custom Your Dialog
Here is some configuration that you can use. Use this configuration on onStart(). Optional you can use it or not.
public class CustomMyLibDialog extends MyLibDialog {
...
public CustomMyLibDialog() {
//super(R.style.CustomDialogStyle); // use this to change style . like Animation
}
@Override
public void onStart() {
super.onStart();
// disable cancel
getDialog().setCancelable(false);
// disable dismiss dialog out side
getDialog().setCanceledOnTouchOutside(false);
// set dialog full screen
setFullScreen(true);
// set canvas width, avaliable value 0.1 - 1.0
setCanvasWidth(0.3);
// set BackButton to dismiss dialog
enableBackButton(true);
//set gravity dialog
setGravity(Gravity.BOTTOM);
}
...
}- Custom your animation dialog show
Use super constructor in your constructor to change style
public class CustomMyLibDialog extends MyLibDialog {
...
public CustomMyLibDialog() {
super(R.style.CustomDialogStyle); // use this to change style . like Animation
}
...
}Here is the style
<resources>
<!-- res->styles.xml -->
<style name="CustomDialogStyle" parent="Theme.MaterialComponents.Light.Dialog">
<item name="android:windowMinWidthMajor">80%</item>
<item name="android:windowMinWidthMinor">80%</item>
<item name="android:windowEnterAnimation">@anim/anim_in</item>
<item name="android:windowExitAnimation">@anim/anim_out</item>
</style>
</resources>Style that i prepare for you
- anim_in & anim_out.
- slide_down & slide_up.
- Change Corner
You can change corner on canvas. With this step.
public class CustomMyLibDialog extends MyLibDialog {
...
@Override
public void onViewCreated(@NonNull View view, @Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
LinearLayout _dialogCanvas = view.findViewById(R.id.dialog_canvas);
_dialogCanvas.setBackground(requireActivity().getResources().getDrawable(R.drawable.rounded_corner));
_dialogCanvas.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
getDialog().dismiss();
}
});
}
}To dismiss Dialog
getDialog().dismiss();- Example Corner
R.drawable.rounded_corner
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<corners
android:bottomLeftRadius="10dp"
android:bottomRightRadius="10dp"
android:topLeftRadius="10dp"
android:topRightRadius="10dp" />
<solid android:color="@android:color/white" />
</shape>Other Example:
- Same Radius ->
R.drawable.rounded_cornerxml Preview - Different Radius ->
R.drawable.rounded_corner_2xml Preview - Dialog 3D ->
R.drawable.rounded_layerxml Preview - Shadow Dialog ->
R.drawable.dialog_shadowxml Preview
MainActivity.java
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
Fragment previous = getSupportFragmentManager().findFragmentByTag(CustomMyLibDialog.TAG);
if(previous != null){
transaction.remove(previous);
}
CustomMyLibDialog dialog = CustomMyLibDialog.newInstance();
dialog.show(transaction, CustomMyLibDialog.TAG);Preview :
 |
 |
|---|---|
Use setFullScreen(true) |
Use setCanvasWidth(0.3) |
FullCode MainActivity & CustomMyLibDialog & XML
- 1.0.0
- First Release
- 1.0.1
- Add animation and set custom animation
- 2.0.0
- Support SDK 16
- 2.0.1
- Bug Fixing
- 2.1.0
- Gravity
You can sent your constibution to branch open-pull.
Copyright 2020 M. Fadli Zein