Primary side bar

Opciones de sidebar primaria

La barra lateral primaria de Visual Studio Code se compone de diferentes vistas que se activan mediante los iconos de la Activity Bar. Cada vista proporciona funcionalidades específicas para trabajar con tu proyecto, desde la navegación de archivos hasta la gestión de extensiones.

Activity Bar y navegación entre vistas

La Activity Bar es la columna vertical de iconos situada en el extremo izquierdo de la interfaz. Estos iconos actúan como interruptores que permiten cambiar entre las diferentes vistas de la barra lateral:

• Explorer (Ctrl+Shift+E): Icono de carpeta para navegación de archivos
• Search (Ctrl+Shift+F): Icono de lupa para búsqueda en el proyecto
• Source Control (Ctrl+Shift+G): Icono de ramificación para control de versiones
• Run and Debug (Ctrl+Shift+D): Icono de play para depuración
• Extensions (Ctrl+Shift+X): Icono de cuadrados para gestión de extensiones

Al hacer clic en cualquier icono, la vista correspondiente se abre en la barra lateral. Si haces clic en el mismo icono cuando su vista ya está activa, la barra lateral se ocultará completamente.

Vista Explorer

La vista Explorer es el panel principal para la navegación de archivos y carpetas. Muestra la estructura jerárquica de tu proyecto en forma de árbol expandible, donde puedes:

• Expandir y contraer carpetas haciendo clic en las flechas
• Abrir archivos con un solo clic para previsualización o doble clic para edición
• Visualizar el estado de los archivos mediante iconos y colores

Esta vista incluye diferentes secciones que se pueden expandir o contraer individualmente:

• Carpetas abiertas: Muestra todos los directorios del workspace actual
• Outline: Estructura del archivo activo (funciones, clases, variables)
• Timeline: Historial de cambios del archivo seleccionado

Vista Search

La vista Search proporciona capacidades de búsqueda a nivel de proyecto. El panel presenta varios campos de entrada que permiten localizar contenido específico:

• Campo de búsqueda principal: Introduce el texto a buscar
• Campo de archivos: Especifica patrones de archivos donde buscar
• Campo de exclusión: Define archivos o carpetas a ignorar

Los resultados de búsqueda se muestran organizados por archivo, con cada coincidencia indicando el número de línea y el contexto circundante. Puedes hacer clic en cualquier resultado para navegar directamente a esa ubicación en el editor.

Vista Source Control

La vista Source Control muestra el estado del control de versiones de tu proyecto. Aunque requiere configuración adicional para funcionar completamente, la interfaz básica incluye:

• Panel de cambios: Lista de archivos modificados, añadidos o eliminados
• Área de staging: Zona para preparar cambios antes del commit
• Campo de mensaje: Espacio para escribir descripciones de los cambios

Cuando no hay un repositorio configurado, esta vista muestra opciones para inicializar un nuevo repositorio o clonar uno existente. Los archivos aparecen con diferentes colores según su estado: verde para nuevos, amarillo para modificados.

Vista Extensions

La vista Extensions es el centro de gestión para las extensiones de Visual Studio Code. La interfaz se divide en varias secciones:

• Campo de búsqueda: Localiza extensiones específicas en el marketplace
• Extensiones instaladas: Lista de extensiones actualmente disponibles
• Extensiones recomendadas: Sugerencias basadas en tu workspace
• Extensiones populares: Las más descargadas de la comunidad

Cada extensión se presenta con su icono, nombre, descripción y botones para instalar, desinstalar o configurar. Las extensiones instaladas muestran un indicador visual y opciones adicionales de gestión.

Control de visibilidad de paneles

Visual Studio Code ofrece múltiples formas de controlar la visibilidad de la barra lateral y sus componentes:

Ocultar/mostrar la barra lateral completa:

• Usar el atajo Ctrl+B (Windows/Linux) o Cmd+B (Mac)
• Hacer clic en el icono activo de la Activity Bar
• Usar el menú View > Appearance > Primary Side Bar

Redimensionar la barra lateral:

• Arrastrar el borde derecho de la barra lateral para ajustar su ancho
• Hacer doble clic en el borde para auto-ajustar al contenido

Personalizar la Activity Bar:

• Clic derecho en la Activity Bar para acceder al menú contextual
• Ocultar iconos específicos que no uses frecuentemente
• Reordenar iconos arrastrándolos a nuevas posiciones

La configuración de visibilidad se mantiene entre sesiones, por lo que tus preferencias se conservan al reiniciar Visual Studio Code.