2

Deseo conseguir lo siguiente, como puede ver un Dialog en la parte superior tiene un icono circular de cerrar(x). Tengo el Dialog pero necesito el icono mencionado, ¿ alguna idea para conseguir esto o algo similar ?
introducir la descripción de la imagen aquí

He convertido un Layout normal en Dialog, de esta forma. En el manifests he aplicado el siguiente Style

Style

 <style name="formularios" parent="Base.Theme.AppCompat.Light.Dialog">
        <item name="android:background">@color/formulario</item>
        <item name="android:radius">@dimen/from</item>
    </style>

y luego en el manifests aplico el estilo

android:theme="@style/formularios"

2 respuestas 2

2

Lo que necesitas es crear un CustomDialog el cual lo vas a conformar a partir de un Layout común y corriente con background transparente, puedes usar una imagen para colocar ahí tus opciones como por ejemplo el botón de cerrar. Generalmente yo usaba frameLayout.

Ya en tu actividad llenas tu diálogo con el layout que hayas creado:

Te dejo un ejemplo completo para que le entiendas mucho mejor

 private void alert_win() {

        //** Aquí empieza la parte que nos interesa**

        dialog = new Dialog(GameScreen.this);
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
        dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));//Aquí le das ele efecto de transparencia
        dialog.getWindow().getAttributes().windowAnimations = R.style.DialogAnimation;
        dialog.setContentView(R.layout.winner_dialog);//Aquí cargas el layout
        dialog.setCanceledOnTouchOutside(false); //Evita cerrar el diálogo cuando tocas fuera de el.

 //** Aquí termina la parte que nos interesa**


        Typeface typeFace=Typeface.createFromAsset(getAssets(), "bellosmcp.ttf");

        TextView moTextView = (TextView) dialog.findViewById(R.id.moTextView);
        moTextView.setTypeface(typeFace);
        moTextView.setText(String.valueOf(_turn_count));
        TextView matchTextView = (TextView) dialog.findViewById(R.id.matchTextView);
        matchTextView.setTypeface(typeFace);
        movesTextView.setTypeface(typeFace);
        matchTextView.setText(String.valueOf(_score));
        TextView pairstextView =(TextView) dialog.findViewById(R.id.pairstextView);
        pairstextView.setTypeface(typeFace);
        pairstextView.setText(Integer.toString(c));
        ImageView closeDialog = (ImageView) dialog.findViewById(R.id.close);
        TextView highScoreTextView = (TextView) dialog.findViewById(R.id.high_Score);
        highScoreTextView.setTypeface(typeFace);
        highScoreTextView.setText(String.valueOf(user.high_score));


.......
         //** Aquí colocas un button o imagebutton que cierre el diálogo**  
        closeDialog.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                dialog.dismiss();
                if (mInterstitialAd.isLoaded()) {
                    mInterstitialAd.show();
                } else {
                    go_home();
                    send_score();
                }
                //display_unlocked_card_alert();


                display_unlocked_card_alert();


            }
        });


        ImageButton resetGame =(ImageButton) dialog.findViewById(R.id.resetGame);
        resetGame.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                dialog.dismiss();

                    reset_game();

                display_unlocked_card_alert();




            }
        });

        dialog.show();

        Log.d(  TAG,"unlocked_check value 2 = " + unlocked_check);
    }

Layout de contenido del Diálogo

<?xml version="1.0" encoding="UTF-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:background="@android:color/transparent"
    android:id="@+id/winner"><![CDATA[
  android:padding="10dip">

    ]]>

    <ImageView
  android:id="@+id/about_logo"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
    android:layout_gravity="center"
  android:layout_centerHorizontal="true"
  android:src="@drawable/fondo_score"
    android:layout_marginLeft="10dip"
    android:layout_marginRight="10dip"
    android:layout_marginBottom="10dip" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/high_score"
        android:id="@+id/highScore"
        android:paddingRight="10dp"
        android:scaleType="fitXY"
        android:layout_gravity="center"
        android:paddingLeft="50dp"
        android:layout_marginLeft="100dp"
        android:layout_marginBottom="50dp" />

    <ImageView
        android:id="@+id/gameResults"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/this_match"
        android:scaleType="fitXY"
        android:layout_marginRight="200dp"
        android:layout_alignParentStart="true"
        android:layout_below="@+id/close"
        android:layout_gravity="center"
        android:paddingLeft="230dp" />

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/try_again_efects_image"
        android:id="@+id/resetGame"
        android:layout_below="@+id/pairstextView"
        android:layout_alignEnd="@+id/gameResults"
        android:layout_marginTop="125dp"
        android:layout_gravity="center"
        android:layout_marginRight="100dp"
        android:layout_marginLeft="20dp" />

    <TextView style="@style/match_results"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="This match"
        android:shadowColor="@color/text_shadow"
        android:shadowDx="-1"
        android:shadowDy="-1"
        android:shadowRadius="2"
        android:scaleType="fitCenter"
        android:id="@+id/matchTextView"
        android:gravity="center_horizontal"
        android:layout_above="@+id/moTextView"
        android:layout_gravity="center"
        android:layout_marginTop="0dp"
        android:layout_marginBottom="40dp"
        android:layout_marginRight="80dp" />

    <TextView style="@style/match_results"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="Moves"
        android:shadowColor="@color/text_shadow"
        android:shadowDx="-1"
        android:shadowDy="-1"
        android:shadowRadius="2"
        android:scaleType="fitCenter"
        android:id="@+id/moTextView"
        android:layout_centerVertical="true"
        android:layout_alignStart="@+id/matchTextView"
        android:layout_gravity="center"
        android:layout_marginRight="80dp"
        android:layout_marginTop="10dp" />

    <TextView style="@style/match_results"
        android:id="@+id/pairstextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Pairs"
        android:shadowColor="@color/text_shadow"
        android:shadowDx="-1"
        android:shadowDy="-1"
        android:shadowRadius="2"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:layout_alignBottom="@+id/gameResults"
        android:layout_alignParentStart="true"
        android:scaleType="fitCenter"
        android:layout_gravity="center"
        android:layout_marginRight="84dp"
        android:layout_marginTop="65dp" />

    <TextView style="@style/high_score"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="Medium Text"
        android:id="@+id/high_Score"
        android:layout_gravity="center"
        android:layout_marginLeft="100dp"
        android:layout_marginBottom="40dp" />

    <ImageView
        android:layout_width="44dp"
        android:layout_height="44dp"
        android:background="@drawable/ic_close_dialog"
        android:id="@+id/close"
        android:layout_gravity="center"
        android:layout_marginLeft="160dp"
        android:layout_marginBottom="160dp"
        android:scaleType="fitXY" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/copa"
        android:id="@+id/imageView3"
        android:layout_gravity="center"
        android:layout_marginLeft="100dp"
        android:layout_marginTop="60dp"
        android:layout_marginRight="10dp" />

</FrameLayout>

Eso queda de esta manera:

introducir la descripción de la imagen aquí

Como puedes ver puedes crear un dialogo a partir un layout o lo que tu quieras, yo uso este tipo de diálogos cuando requiero un con muchas opciones o bien uno que no mantenga el aspecto común.

5
  • Esta función va dentro del mismo layout ?
    – Ashley G.
    Commented el 11 ene. 2017 a las 16:33
  • ¿Cómo? Creas un layout, ejemplo tienes dos: dialogo.xml y mainactivity.xml, dentro de tu actividad del layout donde quieres que se muestre el dialogo, por ejemplo en MainActivity colocas esa función.
    – x4mp73r
    Commented el 11 ene. 2017 a las 16:42
  • voy a llamar un dialogo cuando abra el main y este estará "encima" del layout?
    – Ashley G.
    Commented el 11 ene. 2017 a las 16:48
  • En sí, se comporta como un diálogo común y corriente, ya que estará encima del layout donde se llame, la única diferencia es que es custom, es decir, está compuesto por un layout. Puedes llamarlo de donde quieras, desde un botón, al inicio, etc. ¿Qué es lo que no entiendes?
    – x4mp73r
    Commented el 11 ene. 2017 a las 17:03
  • el problema era que yo tenia ya construido todo en un solo layout he intente añadir este icono sin llamar otro dialogo, pero funciona como tu lo has descrito
    – Ashley G.
    Commented el 11 ene. 2017 a las 17:57
0

Si puedes, es todo un tema de maquetación te propongo lo siguiente:

introducir la descripción de la imagen aquí

  • El contenedor celeste seria el padre o la vista principal del DialogFragment puede ser un RelativeLayout.

  • El contenedor rojo seria el cerrar botón alineado a la derecha con margenes como lo necesites y le colocas el id "@+id/btn_cerrar".

  • El contenedor verde debajo del boton de "cerrar" maquetarias un segundo hijo LinearLayout podria ser en este caso para el panel de opciones usa el atributo layout_below="@id/btn_cerrar" por ejemplo.

ahora al contenedor padre le vas a colocar un background transparente eso es para que parezca que el botón del "cerrar" esta en el aire o flotando.

y al contendedor debajo del "cerrar" o el LinearLayout le colocar un drawable hecho por ti que tenga un fondo blanco borde redondeados o lo que necesites y listo ya con eso queda.

ya solo queda de tu parte hacer la programación de lo que hace cada botón.

así es como yo lo haría y ya me a tocado hacer este tipo de cosas.

1
  • He intentado esto pero no consigo que el icono, quede en la parte superior...
    – Ashley G.
    Commented el 11 ene. 2017 a las 16:27

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.