comment créer une application Windows basée sur une mind-map basée sur une vue arborescente dans .NET

Question

Je cherche à créer une structure arborescente intuitive (sur les lignes similaires d'une Mind-map) pour mon application Windows .NET (WPF).

Quelque chose sur les lignes similaires comme this ou this

Je prévois d'abord de développer un exemple d'application, dans laquelle mon application se contente de lire un fichier XML structuré sous-jacente pour créer un état d'esprit carte comme la visualisation et l'afficher à la utilisateur. L'utilisateur peut sélectionner n'importe lequel des nœuds d'arborescence affichés. Si le noeud a des noeuds enfants, il doit être affiché lorsque l'utilisateur clique sur le noeud parent correspondant.

Pour ce faire, j'ai besoin d'un heads-up ou d'aide dans la bonne direction pour commencer. Toute aide est grandement appréciée

Answer 1

J'ai déjà fait une carte réseau dans WPF, mais pas une Mind Map. Ce n'est pas facile et prendrait quelques pages pour expliquer chaque étape. J'ai donc donné un démarrage rapide ci-dessous sur la façon dont j'ai accompli ma carte réseau. Je ne pense pas qu'il y aurait beaucoup de différence à part la disposition et la représentation visuelle des nœuds et des connecteurs de nœuds.

Le premier point de départ est votre collection. MSDN a une collection Directed Graph tueur disponible ici: http://msdn.microsoft.com/en-us/library/ms379574(v=vs.80).aspx. Une fois votre collection établie, vous devrez étendre la classe Panel afin qu'elle puisse effectuer votre mise en page pour vous. Je ne connais aucun panneau de disposition Mind Map existant, mais voici un lien vers une disposition de panneau radial: http://msdn.microsoft.com/en-us/library/ms771363(v=vs.90).aspx. Il devrait vous montrer les étapes nécessaires pour placer les choses dans une mise en page personnalisée.

Vous aurez également besoin d'un moyen de représenter visuellement vos nœuds de graphes orientés. La plus belle chose à propos de WPF est que vous pouvez créer vos propres UserControls et si votre panneau est créé pour une mise en forme correcte, il effectuera tout le travail de mise en page pour vos contrôles personnalisés. Ma carte réseau était simplement un UserControl avec une ellipse en arrière-plan, lancée dans un panneau radial.

La dernière étape est la possibilité d'examiner votre collection de graphiques et de dessiner les connecteurs entre les nœuds connectés. Dans ma collection de graphes orientés, j'ai ajouté une propriété de type object appelée Tag et j'ai stocké la version UserControl du noeud. De cette façon, je connais les coordonnées des UserControls connectés et je peux les connecter avec un PolyLine. Je pense que la différence pour vous est que vous voulez votre connecteur en tant qu'image.

C'est la version rapide. J'aimerais publier du code source ici qui montre plus, mais je l'ai écrit pour le travail et ils me tueraient.