2015-08-29 1 views
0

Je suis en train de mettre en œuvre la disposition suivante:Comment aligner à droite pour le premier composant

 Name: James 
    Gender: Male 
Followers: Brian, Jason and Mike. 

Je peux imaginer que le haut niveau est d'utiliser CKStackLayout, mais pour chaque entrée, par exemple "Nom: James", comment puis-je aligner le nom à droite dans une boîte? J'utilisais quelque chose comme ce qui suit, enveloppez le texte dans un composant de largeur fixe et définissez le composant d'étiquette pour utiliser l'alignement NSTextAlignmentRight, mais cela ne fonctionne pas et les deux gauche et droite ne sont que 'left-align':

static CKComponent *singleLine(NSString *left, NSString *right) 
{ 
    CKStackLayoutComponent *stackComponent = 
    [CKStackLayoutComponent 
    newWithView:{} 
    size:{} 
    style:{ 
    .direction = CKStackLayoutDirectionHorizontal, 
    .alignItems = CKStackLayoutAlignItemsStretch,} 
     children:{ 
     {.component = [CKStaticLayoutComponent 
         newWithView:{} 
         size:{.width = CKRelativeDimension(10)}]}, 
     {.component = 
      [CKStaticLayoutComponent 
      newWithView:{} 
      size:{.width = CKRelativeDimension(88)} 
      children:{ 
      { 
      .component = 
      [CKLabelComponent 
      newWithLabelAttributes:{ 
       .string = left, 
       .alignment = NSTextAlignmentRight, 
       .font = [UIFont boldSystemFontOfSize:14.0], 
       .maximumNumberOfLines = 1 
      } 
      viewAttributes:{}], 
      } 
     }], 
    }, 
    { 
     .component = 
     [CKLabelComponent 
     newWithLabelAttributes:{ 
      .string = right, 
      .alignment = NSTextAlignmentLeft, 
      .font = [UIFont systemFontOfSize:14.0], 
      .maximumNumberOfLines = 1 
     } 
     viewAttributes:{}], 
     .spacingBefore = 10.0 
    } 
    }]; 

    return stackComponent; 
} 

Merci!

+0

J'ai fini à l'aide » .Size = CKRelativeSizeRange (CKRelativeSize (CKRelativeDimension (88), 0), {}) "dans le' CKStaticLayoutComponent'. Fondamentalement, ajouter une largeur min à 'CKLabelComponent', puis le texte est aligné à l'intérieur de ces limites. – lorixx

Répondre

1

Je pense que votre solution est bonne. Une autre solution consisterait à écrire votre propre mise en page personnalisée en remplaçant computeLayoutThatFits:. Il est préférable d'éviter cela en général, mais pour les mises en page complexes comme les formulaires, il peut être une bouée de sauvetage.

+0

Merci Adam! C'est utile – lorixx

0

Peut être vous devriez donner l'stacklout externe (qui wrap Multil seule ligne, et a la direction de mise en page verticale): .alignItems = CKStackLayoutAlignItemsStretch