tutorial de eclipse_terminado

101
CETis 109 Aixa Elizabeth Rodríguez Martínez 4°Am Programación Desarrolla Aplicaciones Móviles MCA: Margarita Romero Alvarado Tutorial de Uso de Eclipse

Upload: aixa-rodriguez

Post on 06-Jan-2017

131 views

Category:

Software


0 download

TRANSCRIPT

Page 1: Tutorial de eclipse_terminado

CETis 109

Aixa Elizabeth Rodríguez Martínez

4°Am Programación

Desarrolla Aplicaciones Móviles

MCA: Margarita Romero Alvarado

Tutorial de Uso de Eclipse

Page 2: Tutorial de eclipse_terminado

¿Qué es Eclipse?• Eclipse es una plataforma de software compuesto por un conjunto de herramientas de programación de código abierto multiplataforma para desarrollar lo que el proyecto llama "Aplicaciones de Cliente Enriquecido", opuesto a las aplicaciones "Cliente-liviano" basadas en navegadores. Esta plataforma, típicamente ha sido usada para desarrollar entornos de desarrollo integrados (del inglés IDE), como el IDE de Java llamado Java Development Toolkit (JDT) y el compilador (ECJ) que se entrega como parte de Eclipse (y que son usados también para desarrollar el mismo Eclipse).

Page 3: Tutorial de eclipse_terminado

¿Para que sirve?•  Eclipse sirve para desarrollar programas que estén principalmente orientada a objetos, también nos puede servir para el desarrollo y creación de software.

Page 4: Tutorial de eclipse_terminado

Donde fue desarrollado Eclipse:• originalmente por IBM como el sucesor de su familia de herramientas para VisualAge. Eclipse es ahora desarrollado por la Fundación Eclipse, una organización independiente sin ánimo de lucro que fomenta una comunidad de código abierto y un conjunto de productos complementarios, capacidades y servicio

Page 5: Tutorial de eclipse_terminado

Caracteristicas:• Dispone de un editor de texto con resaltado de sintaxis donde puedes ver el contenido del fichero en el que estás trabajando. • Contiene una lista de tareas y otros módulos similares. • La compilación es en tiempo real. • Tiene pruebas unitarias con JUnit. • Integración con Ant, asistentes (wizards) para creación de proyectos, clases, tests, etc., y refactorización.

Page 6: Tutorial de eclipse_terminado

Eclipse es un código abierto

• El software de código abierto es un software lanzado con una licencia que pretende asegurarse de que se les otorguen ciertos derechos a los usuarios.El derecho más obvio es que el código fuente debe estar disponible, entonces los usuarios tienen la libertad de modificar y de re distribuir el software. Esta protección de los derechos de los usuarios se alcanza con un dispositivo denominado copyleft: la licencia del software solicita la protección del derecho de autor y prohíbe la distribución, a menos que el usuario tenga esos derechos. El copyleft también requiere que cualquier software redistribuido sea cubierto por la misma licencia.por este motivo, el propósito del derecho de autor se sostiene en su título copyleft a menudo se describe como "todos los derechos revocados".

Page 7: Tutorial de eclipse_terminado

Tutorial de Eclipse

Page 8: Tutorial de eclipse_terminado

• Paso 1 abrir eclipse

Page 9: Tutorial de eclipse_terminado

ControlDelproyector

Menú

Editor Del código

Control de la ejecución

Page 10: Tutorial de eclipse_terminado

• Paso 2: Una vez abierto el programa darle clic en file y después en New y finalmente en Java Project

Page 11: Tutorial de eclipse_terminado

• Paso 3: Ponerle un nombre al proyecto y después hacer clic en finish

Page 12: Tutorial de eclipse_terminado

• Paso 4: después de haber creado el proyecto ir al botón verde donde dice New Java Class y darle clic.

Page 13: Tutorial de eclipse_terminado

• Paso 5:Le ponemos un nombre y después le damos en finish

Page 14: Tutorial de eclipse_terminado

• Paso 6:Una vez hecho esto se abrir una ventana donde podremos comenzar a escribir las declaraciones

Page 15: Tutorial de eclipse_terminado

• Paso 7: Una vez listo le damos en el botón verde donde señala Run

Page 16: Tutorial de eclipse_terminado

•Nos abrirá una ventana y le damos en OK

Page 17: Tutorial de eclipse_terminado

• Una vez hecho esto en la parte de abajo en donde dice Console nos mostrará el programa corrido.

Page 18: Tutorial de eclipse_terminado

Como funciona la barra de opciones en Eclipse

Page 19: Tutorial de eclipse_terminado

File•En el entorno de desarrollo Eclipse todo archivo se almacena dentro de un proyecto. Esto quiere decir que todo documento, carpeta, archivo de código fuente (.java) y código compilado (.class) tiene que estar contenido dentro de un proyecto.

Page 20: Tutorial de eclipse_terminado

nuevo

Abrir archivoCerrar y cerrartodo

Salvar

Mover

importar

Exportar

Renombrar

Salir

Page 21: Tutorial de eclipse_terminado

Edit• Para crear o editar programas Java, un "Java Project" debería ser creado. Nótese que dentro de un proyecto de Java también puede almacenarse toda la información relacionada con el proyecto (la cual no tiene por qué reducirse estrictamente a código fuente, sino que también puede contener documentación y otros archivos relacionados).

Page 22: Tutorial de eclipse_terminado

Copiar

EliminarPegar

Seleccionartodo

Page 23: Tutorial de eclipse_terminado

Source• En esta parte se almacenan los archivos de código fuente de Java (.java), de manera que Eclipse sepa donde encontrarlos y pueda realizar la compilación automática de los mismos cada vez que un archivo sea guardad

Page 24: Tutorial de eclipse_terminado

ComentarioDe palanca

Añadir bloqueDe comentario

DesplazamientoA la derecha

Desplazamiento Ala izquierda

Quitar BloqueDe comentario

Generar elementoDe Comentario

Page 25: Tutorial de eclipse_terminado

Navigate• La vista Navigator de la perspectiva Resource y la vista Package Explorer de la perspectiva Java contienen un directorio con el nombre del proyecto. Como se menciona anteriormente, se puede pasar de una perspectiva a otra pulsando sobre los botones de la barra vertical izquierda

Page 26: Tutorial de eclipse_terminado

AbrirIr a

Abrir tipo

Abrir desde el portapapeles

Mostrar en

Page 27: Tutorial de eclipse_terminado

Search•Para realizar una búsqueda dentro de Eclipse, el menú "Search" de la barra superior de menús debe de ser seleccionado. También se pueden hacer búsquedas pulsando el icono de la linterna

Page 28: Tutorial de eclipse_terminado

Archivo Buscar

JavaTexto

ReferenciasDeclaraciones

Implementadores Acceso de lectura

Acceso de escritura

Ocurrencias de archivo

Pruebas de referencia

Page 29: Tutorial de eclipse_terminado

ProjectManejo de archivos, manejo de texto, editores de texto. O lo deberían crearse para almacenar documentos y otros archivos, pero no código Java que se desee compilar. Por ello, siempre que se creen archivos ".java" sería recomendable crear un "Java Project ".

Page 30: Tutorial de eclipse_terminado

Abrir proyecto

Cerrar proyecto

Construir el conjunto De trabajo

Limpiar

Construir automaticamente

Page 31: Tutorial de eclipse_terminado

Refactor• Muchas veces tenemos código ya hecho que está funcionando. También muchas veces necesitamos tocar ese código para que haga más cosas, para hacer más eficiente un algoritmo, más vistosa la salida del programa, porque tenemos otro proyecto que se parece, etc, etc.

Page 32: Tutorial de eclipse_terminado

Cambio deTipo de widget

Cambio de diseño

Page 33: Tutorial de eclipse_terminado

Window•Es la barra de opciones que contiene eclipse para poder crear otros archivos tales como personalizar perspectiva.

Page 34: Tutorial de eclipse_terminado

Nueva ventana

Nuevo editorAbrir perspectiva

Mostrar la presentación

Page 35: Tutorial de eclipse_terminado

Help•Es la barra de opciones que nos asesora en caso de tengamos algún problema y no sabemos como solucionarlo podemos acudir a esta parte de eclipse

Page 36: Tutorial de eclipse_terminado

Bienvenidos

Contenidos de ayuda Buscar

Ayuda Dinamica

Page 37: Tutorial de eclipse_terminado

Package Explorer•Es el nombre del paquete de esta aplicación. Es importante recordar que en el mismo dispositivo sólo puede haber instalada una aplicación con el mismo package , por lo que necesitamos que sea único

Page 38: Tutorial de eclipse_terminado

Explorador de archivos

Nombre del Archivo que estamosutilizando

Page 39: Tutorial de eclipse_terminado

Para crearUno nuevo

AndroidSDKManager

Android virtual device manager

Run Android Lint

Page 40: Tutorial de eclipse_terminado

New android XML File Depurar

Ejecutar

Ultima herramienta de gestión

Nuevo paquetejava Nueva clase java

Abrir tipos Busqueda

Page 41: Tutorial de eclipse_terminado

Java project• Para crear o editar programas Java, un "Java Project" debería ser creado. Nótese que dentro de un proyecto de Java también puede almacenarse toda la información relacionada con el proyecto (la cual no tiene por qué reducirse estrictamente a código fuente, sino que también puede contener documentación y otros archivos relacionados)

Page 42: Tutorial de eclipse_terminado

Debug

• Almacenan los archivos de código fuente de Java (.java), de manera que Eclipse sepa donde encontrarlos y pueda realizar la compilación automática de los mismos cada vez que un archivo sea guardado.

Page 43: Tutorial de eclipse_terminado

Run As

• El diálogo Configuración Run se puede invocar al seleccionar la opción de menú Ejecutar configuraciones en el menú Ejecutar

Page 44: Tutorial de eclipse_terminado

Run As 2

• El diálogo Ejecutar Configuraciones le permite crear múltiples configuraciones de ejecución . Cada configuración de ejecución se puede iniciar una aplicación.

Page 45: Tutorial de eclipse_terminado

Class

• Encuentras toda una serie de .jar, que es una forma de englobar varios archivos de clases. En definitiva, aquí encontrarás todas las clases que dispones en Java para realizar cualquier tipo de tarea.

Page 46: Tutorial de eclipse_terminado

Search• La búsqueda de Java "Java Search" es similar a la búsqueda de archivos pero proporciona funciones adicionales para buscar en archivos Java. Así pues, permite buscar explícitamente por tipos, métodos, paquetes, constructores y campos, usando restricciones de búsqueda adicionales (como por ejemplo, buscar sólo el punto del código en que se declararon los elementos coincidentes)

Page 47: Tutorial de eclipse_terminado

Problems

•Revisa los problemas que se puedan encontrar mientras crees el programa

Page 48: Tutorial de eclipse_terminado

Android en Eclipse

Page 49: Tutorial de eclipse_terminado

Aplicación en eclipse

Abrimos eclipse, luego nos vamos a File y después a New, luego a donde dice Android Aplicación Project

Page 50: Tutorial de eclipse_terminado

Se abrirá una ventana en donde primero tendremos que elegir el nombre de la aplicación y luego al acabar darle en Next.

Page 51: Tutorial de eclipse_terminado

Aquí solo se da Next

Page 52: Tutorial de eclipse_terminado

Next

Page 53: Tutorial de eclipse_terminado

Next

Page 54: Tutorial de eclipse_terminado

Se oprime Finish

Page 55: Tutorial de eclipse_terminado

Se abrirá un entorno de trabajo en donde podremos diseñar nuestra aplicación y probarla.

Page 56: Tutorial de eclipse_terminado

Como funciona la palette:

Page 57: Tutorial de eclipse_terminado

Palette:La paleta esta conformada por varias carpetas Forma de widgets Campos de texto Diseño Compuesto Imágenes y Media Hora y Fecha Transiciones Avanzado Otro vistas personalizadas y bibliotecas

Page 58: Tutorial de eclipse_terminado

La palette esta conformada por varias carpetas:

Forma deWiddgets Campos de texto

DiseñoCompuesto

]Imágenes & mediaHora y fecha

TrancicionesAvanzado

Otro

Visitas personalizadasY biblioteca

Page 59: Tutorial de eclipse_terminado

A continuación se explica para que sirve cada carpeta de la palette

Page 60: Tutorial de eclipse_terminado

Configuración de el Render este diseño Con eclipsada Un nexo Ir al siguiente

estado temas

Versión delandroid

Actividad Asociada de ContextoFragmento proporcionado

Localizar para su empleo Generar presentaciones eneclipse

Page 61: Tutorial de eclipse_terminado

Ancho relleno De palanca

Largo rellenoDe palanca

Márgenes decambio

Cambio degravedad

Mostrar Restricciones

Mostrar todas las relaciones

Opciones delzoom

Page 62: Tutorial de eclipse_terminado

Form Widgets

•Hemos entonces asignado como nombre a este objeto: tv1 (recordemos que se trata de un objeto de la clase TextView)

Page 63: Tutorial de eclipse_terminado

Para insertar un botón:Largo, mediano y chicoInsertar un botón chico

Insertar un botóndeslizableInsertar un botón

rectangularInsertar un botón circularInserta un circulo

En espera

Inserta una barra queMuestra el progresoAl cargar

Insertar una línea de Carga o de progreso

Hacer el botón de carga Grande o chico

Insertar un grupoDe botones circulares

Insertar un boton deEncendido y apagado

Inserta una barra para calificar

Page 64: Tutorial de eclipse_terminado

TEXT FIELDS• En la ventana de properties estando seleccionado el EditText configuramos la propiedad Id... con el nombre et1 (este nombre haremos referencia posteriormente desde Java) Efectuamos los mismos pasos para crear el segundo TextView y EditText (inicializamos las propiedades respectivas) Definimos los id con los nombres tv2 y et2,

Page 65: Tutorial de eclipse_terminado

Insertar texto

Insertar una contraseña

Insertar una direcciónInsertar la hora

Insertar un numero

Insertar númerosCon punto decimal

insertar un auto Corrector de el texto

Insertar una personalizaciónDe tu nombre

Insertar contraseñaCon númerosInsertar un numero de teléfono

Insertar múltiple textoInsertar la fecha

Insertar numeros negativos

Insertar un multiAuto corrector o Complementario De palabras

Page 66: Tutorial de eclipse_terminado

LAYOUTS•Definiremos por tanto dos fragments: uno para el listado y otro para la vista de detalles. Ambos serán muy sencillos. Al igual que una actividad, cada fragment se compondrá de un fichero de layout XML para la interfaz (colocado en alguna carpeta /res/layout) y una clase java para la lógica asociada.

Page 67: Tutorial de eclipse_terminado

Insertar diseño decuadricula Insertar un diseño

De lineas verticalesInsertar un diseñoDe lineas horizontales Insertar un diseño con

marco

Insertar un diseñorelativo

Insertar un diseño que Incluye otra disposiciónDe fragmento

Insertar un diseño queIncluye otra disposición

Insertar un diseño detabla

Insertar una fila en latabla

Page 68: Tutorial de eclipse_terminado

COMPOSITE•Elemento contenedor de otros elementos de control. Sirve de referencia para el redimensionado de los elementos contenidos en él.

Page 69: Tutorial de eclipse_terminado

Verlo en forma de listaInsertar una listaexpandible

Vista cuadriculadaVista en vertical

Vista en horizontal Vista como buscador

Insertar un cajóndeslizante Diferentes tipo de

tablasVisita como web

Page 70: Tutorial de eclipse_terminado

Images & media

Sirve para la vista de imágenes , para poner botón de

imagen, Tiene opción para buscar las imágenes en galería ,también tiene

controlador de medios de comunicación y para ver video.

Page 71: Tutorial de eclipse_terminado

Vista imagen

Inserta una imagen o videoDe tu galería

Vista video

Insertar un boton imagen

Inserta un Controlador deLos videos

Page 72: Tutorial de eclipse_terminado

TIME & DATE

•Son dos de las clases más usadas cuando

una aplicación implica el trabajo con

fechas

Page 73: Tutorial de eclipse_terminado

Insertar un Selector de hora

Insertar un selectorDe fechas

Insertar vistacalendario Insertar un

cronometro

Insertar un relojdigital

Page 74: Tutorial de eclipse_terminado

TRANSITIONS•La animación que

muestra el último botón es simplemente la que el dispositivo aplica por defecto tanto al iniciar una Activity como al

hacer back.

Page 75: Tutorial de eclipse_terminado

Inserta una imagenDelante de el textoInsertar una imagen

Que se mueva para El lado izquierdo O derecho

Vista pila

Insertar el textoDelante de la imagen

Vista animador

Vista multiple

Vista delante del texto

Page 76: Tutorial de eclipse_terminado

ADVANCED• La barra de herramientas de diseño permite seleccionar varios elementos de diagrama y establecer sus atributos de alineación, tamaño y espaciado, e incluye opciones para estilos de línea para dibujar transiciones, generalizaciones, asociaciones y otras líneas de conexión en el estilo más claro para su diagrama.

Page 77: Tutorial de eclipse_terminado

Gestiona los Sucesos asociadosAl cambio de foco

Inserta atributos que Pueden ser usados conOtras subclases

Insertar una Extensión XML Insertar una clase

Atributo con nombreInserta atributos especificos

Vista de la superficie

Vista de textura

Insertar selector denúmeros

Insertar un botón Para zoom

Insertar controladoresDe zoom

Page 78: Tutorial de eclipse_terminado

Continuación Advanced:

Insertar dobleLista con linea

Insertar un filtro de llamada

Insertar un rango abdoluto

Page 79: Tutorial de eclipse_terminado

CUSTOM & LIBRARY VIEWS• Amplía las capacidades de Eclipse

para que pueda configurar rápidamente nuevos proyectos para Android, crear una interfaz

de usuario de la aplicación, agregar paquetes basados en la

API de Android Framework, depurar sus aplicaciones usando el SDK de Android herramientas,

e incluso exportar firmado (o signo) .apk archivos con el fin de

distribuir la aplicación.

Page 80: Tutorial de eclipse_terminado

Aquí se ponen archivos Que el usuario crea paraUsarlos en su aplicación

Page 81: Tutorial de eclipse_terminado

Other • Insertar la hora en forma de texto

Page 82: Tutorial de eclipse_terminado

Ahora nos enfocaremos en las propiedades:

Page 83: Tutorial de eclipse_terminado

Identificador

Contenido de descripcion

Relleno inferior

Relleno Superior

VisibilidadEnfocable

Relleno izquierdo

Parametros para e diseño

Fondo

Page 84: Tutorial de eclipse_terminado

Al hacer clic

Armar diseño

Anchura

Etiqueta

Se puede hacer clic

Alineación

Contenido de la descripción

Altura

Vista grupos

Page 85: Tutorial de eclipse_terminado

Carpeta que contienen el codigo fuente de la aplicación.

Carpeta que contiene el código generado de forma automática por el SDK

Carpeta que puede contener una serie abritaria de ficheros o carpetas que podran ser utilizados por la aplicacion

Codigo JAR, el API de Android según la version seleccionada

Librería asociadas al proyecto

Page 86: Tutorial de eclipse_terminado

Código JAR con librerías que quieras usar en tu proyecto. Su objetivo es permitir ciertas funcionalidades importantes no disponibles en el nivel de API

En estas carpetas se almacenan los ficheros de imágenes(JPG o PNG) y descriptores de imagen XML

Carpeta que contiene los recursos usados por la aplicación.

En esta carpeta se complica el código y se genera el apk, fichero comprimido que contiene la aplicación final lista para instalar

Page 87: Tutorial de eclipse_terminado

Contiene ficheros XML con visitas de la aplicación. Las visitas nos permitirán configurar las diferentes pantallas que compondrán la interfaz de usuario de la aplicación.

Ficheros XML con los menus de cada actividad

Tambien utilizaremos ficheros XML para indicar valores del tipo sting, color o estilo. De esta manera podremos cambiar los valores sin necesidad de ir al codigo fuente.

Este fichero describe la aplicación Android. En el que indican las actividades, interacciones, servicios y proveedores de contenido de la aplicacion

Page 88: Tutorial de eclipse_terminado

Icono de la aplicación de gran tamaño para ser usando en paginas web. El nombre puede variar si se indico uno diferente

Fichero generado automáticamente por el SDK. Nunca hay que modificarlo

Fichero de configuración de la herramienta ProGuard que te permite optimizar y ofuscar el código generado

Page 89: Tutorial de eclipse_terminado

Mostrar propiedadesavanzadas

Ordenar alfabeticamente

Restaurar el valor Por ejemplo

Expandir todo

Colapsar todo

Page 90: Tutorial de eclipse_terminado

Borra la consola actualmente activa y esta disponible como un mandato de vista y un elemento del menú contextual

Cambios en caso de bloqueo de desplazamiento debe ser activado o no en la consola actual

Prendedores la consola actual a permanecer en la parte superior de todas las otras consolas Abre una lista de las

consolas actuales y le permite seleccionar cual

Abre una nueva consola del tipo seleccionado

Page 91: Tutorial de eclipse_terminado

Mensajes de error declaración consola

Page 92: Tutorial de eclipse_terminado

• Actividad del menú, donde podemos cambiar el nombre

Page 93: Tutorial de eclipse_terminado

Perspectivas:• Una perspectiva de Eclipse es una agrupación de

vistas y editores de manera que den• apoyo a una actividad completa del proceso de

desarrollo software. Sin embargo, es• posible crear perspectivas propias añadiendo

nuevas vistas y cambiando su distribución• en la pantalla. Las perspectivas pueden

seleccionarse haciendo clic en los iconos de• perspectiva del lateral izquierdo o eligiendo

"Window > Open Perspective" del menú.• Las perspectivas son:

Page 94: Tutorial de eclipse_terminado

•Resource: esta perspectiva está estrechamente relacionada con el sistema de• archivos puesto que representa la localización física de los

recursos almacenados• dentro de los proyectos

• Java: esta perspectiva se centra en tareas de programación, mostrando paquetes,• clases, métodos y atributos en sus vistas asociadas.

•Plug-in development: la perspectiva de desarrollo de plug-in permite a los desarrolladores añadir nuevos módulos de Eclipse.

Page 95: Tutorial de eclipse_terminado

• Install/Update: permite gestión de la configuración. Muestra los componentes instalados así como sus versiones y conflictos.

•Debug: relacionada con la tarea de depuración. Se centra en los procesos ejecutados, puntos de ruptura, variables, salida, etc.

• Java Browsing: esta perspectiva permite ojear rápidamente código, proyectos, paquetes• y jerarquías.

Page 96: Tutorial de eclipse_terminado

Lenguajes de programación utilizados en Eclipse 3.2.1

Page 97: Tutorial de eclipse_terminado

Ventajas de Eclipse:• El entorno de desarrollo integrado (IDE) de eclipse emplea modulos para proporcionar toda su funcionalidad al frente de la plataforma de Cliente rico, a diferencia de otros entornos monoliticos donde las funcionalidades estan todas incluidas, las necesite el usuario o no.• Este mecanismo de modulos es una plataforma ligera para componentes de software. Adicionalmente a permitirle a Eclipse extenderse usando otros lenguajes de programación como son C/C++ y python, permite a eclipse trabajar con lenguajes para procesado de texto como LaTeX, aplicaciones en red como Telnet y sistema de gestión de base de datos.

Page 98: Tutorial de eclipse_terminado

Desventajas de Eclipse:•Su principalmente inconveniente, comun a otros IDEs en mayor o menor medida, en el consumo de recursos del sistema •Tambien que carece de mucho soporte para Webapps (.war, jsp y servlets) tal y como lo hace Netbeans (los Plugins por lo general no son ni tan potentes ni tan sencillos como el modulo que Netbeans viene preinstalado).

Page 99: Tutorial de eclipse_terminado

• En este trabajo podemos ver y comprender para que nos sirven cada una de las herramientas de eclipse. Así podemos saber como utilizarlo. De modo que si tenemos alguna duda podemos recurrir a los conocimientos que hemos adquirido en esta practica.

Page 100: Tutorial de eclipse_terminado

Fuentes:•http://www.javaya.com.ar/detalleconcepto.php?codigo=76&inicio•http://es.slideshare.net/aaronkliteer/pantalla-de-eclipse-presentacion-de-eclipse-sandor-aarn-estrada-hernndez-4b?related=1•https://prezi.com/8_lkuuyre_nm/conceptos-caracteristicas-ventajas-y-desventajas-de-los-i/ •https://prezi.com/8_lkuuyre_nm/conceptos-caracteristicas-ventajas-y-desventajas-de-los-i/ •http://es.slideshare.net/lourdes9898/partes-de-la-pantalla-de-eclipse

Page 101: Tutorial de eclipse_terminado

•http://help.eclipse.org/mars/index.jsp?topic=/org.eclipse.jdt.doc.user/reference/ref-icons.htm•https://es.wikipedia.org/wiki/Eclipse_(software)•http://cvairetti.ing.puc.cl/IIC1103/laboratorio/TutorialEclipse1.pdf