web-dev-qa-db-fra.com

Comment travailler avec différentes résolutions d'écran

J'utilise Unity 4.3.3 pour mon jeu. Je crée un jeu pour les appareils Android et iOS. Étant donné que je suis assez nouveau dans l'unité, je n'arrive pas à trouver un moyen de travailler avec une résolution d'écran différente . J'utilise c # pour mes scripts. 

Je veux que mon jeu soit en plein écran. Je l'ai testé sur iPad 2 et il fonctionne parfaitement, mais pour l'iPhone 4, les côtés sont coupés et pour l'iPhone 5, ils le sont encore plus. Quelle est la solution? Quelle option dois-je choisir sous Paramètres du lecteur> iOS> Autres réglages> Résolution cible?

50
Ashish Beuwria

l'unité change sa caméra vidéo dans le jeu pour qu'elle corresponde aux dimensions du rapport hauteur/largeur de l'écran utilisé. Évidemment, ce n'est pas toujours souhaitable, il y a donc plusieurs façons de contourner cela:

1) La première méthode est très facile à mettre en œuvre, même si elle a rarement une belle apparence. Vous pouvez simplement changer le format d'image de la caméra pour l'adapter à celui sur lequel vous avez conçu votre jeu. Donc si par exemple vous avez conçu votre jeu en 4: 3, vous feriez quelque chose comme ceci:

Camera.aspect = 4f/3f;

Gardez simplement à l'esprit que cela déformera le jeu selon différents ratios d'aspect.

2) L'autre méthode est un peu plus complexe, mais le résultat semble beaucoup mieux. Si vous utilisez une caméra orthographique, gardez à l'esprit que, quelle que soit la résolution de l'écran utilisée, la caméra orthographique maintient la hauteur à une valeur définie et ne modifie que la largeur. Par exemple, avec une caméra orthographique de taille 10, la hauteur sera fixée à 2. Dans cet esprit, il vous faudra compenser la caméra la plus large possible à chaque niveau (par exemple, un fond plus large ) ou modifiez dynamiquement la taille orthographique de la caméra jusqu'à ce que sa largeur corresponde à celle que vous avez créée.

Les composants de l’interface graphique sont plus faciles à implémenter en définissant leur position en fonction de la résolution de l’écran, le cas échéant. Par exemple, si vous souhaitez qu'un bouton apparaisse dans le coin en haut à droite, vous définissez simplement sa position comme suit: position = new Vector2(Screen.width - 50, 50);

EDIT: Puisque vous avez mentionné les appareils que vous avez utilisés, j’ai un peu cherché pour déterminer le rapport de format utilisé par chacun: Ipad2 = 4: 3, Iphone4 = 3: 2 et Iphone5 = 16: 9.

Puisque vous avez dit que cela avait l'air parfait sur l'Ipad2, j'imagine que vous avez conçu votre jeu pour qu'il utilise un rapport hauteur/largeur de 4: 3; La solution consiste à utiliser l'une des deux méthodes que j'ai décrites ci-dessus.

Vous pouvez voir assez facilement à quoi ressemblera chaque périphérique dans l'éditeur d'unité. Si vous allez dans l'onglet de jeu (ce qui apparaît lorsque vous appuyez sur Play dans l'éditeur Unity), vous verrez qu'il a un nom de périphérique, ainsi qu'une résolution et un format d'image. Changer cela vous permettra de voir à quoi cela ressemblera à différents formats.

38
Steven Mills

Vous voudrez peut-être essayer de capturer la résolution du périphérique en utilisant Camera.ScreenWidth et Camera.ScreenHeight.

Ensuite, faites des calculs pour calculer la différence par rapport à la résolution que vous avez et appliquez-la à l'objet parent. 

Cela réduira tout ce qui est plus gros/plus petit pour s’adapter à la résolution du périphérique sans avoir plusieurs résolutions d’image, etc. pour différents périphériques de résolution.

4
KennethLJJ

Vous devez changer la fenêtre de la caméra en fonction du format de l’appareil . Supposons que vous ayez créé le jeu en 720x1080.

Ensuite, dans le script, vous devriez faire

float xFactor = Screen.width / 720f;
float yFactor = Screen.height  / 1080f;

Camera.main.rect = new Rect(0,0,1,xFactor/yFactor);

Ou  

L’autre façon, si vous créez un jeu pour le rapport de format 9:16 puis

Faites ceci dans votre script,

public float targetRatio = 9f/16f; //The aspect ratio of your game
void Start()
{
    Camera cam = GetComponent<Camera>();
    cam.aspect = targetRatio;
}
2
Apurva

Si votre objectif est d'obtenir la largeur précédente:

[RequireComponent(typeof(Camera))]
public class ResizeCamera : MonoBehaviour 
{
    private float   DesignOrthographicSize;
    private float   DesignAspect;
    private float   DesignWidth;

    public  float   DesignAspectHeight;
    public  float   DesignAspectWidth;

    public void Awake()
    {
        this.DesignOrthographicSize = this.camera.orthographicSize;
        this.DesignAspect = this.DesignAspectHeight / this.DesignAspectWidth;
        this.DesignWidth = this.DesignOrthographicSize * this.DesignAspect;

        this.Resize();
    }

    public void Resize()
    {       
        float wantedSize = this.DesignWidth / this.camera.aspect;
        this.camera.orthographicSize = Mathf.Max(wantedSize, 
            this.DesignOrthographicSize);
    }
}
2
SylafrsOne

Je sais que c'est un vieux fil, mais les gens pourraient toujours chercher une réponse.

Pour ajuster une caméra en perspective à différents formats d’écran avec un comportement différent de celui par défaut de Unity, vous avez besoin d’une certaine trigonométrie. Toutes les informations nécessaires à ce sujet se trouvent ici: https://en.wikipedia.org/wiki/Angle_of_view

Si vous voulez un moyen facile de sortir, voici une solution qui fonctionne avec tous les types de caméras: http://u3d.as/oUX

1
DominoOne

La solution la plus simple pour résoudre ce problème a été, comme l'a souligné Steven, de forcer le rapport de format de la caméra en perspective à celui pour lequel je développe. Bien sûr, cela déforme certains objets si le rapport d’aspect pour lequel j’ai développé est trop différent de celui de l’appareil. Pour les objets d'interface utilisateur, si vous utilisez l'intégration, je crée les rectangles en fonction d'un pourcentage de la taille de l'écran. 

Rect(0.5 * Screen.width, 0.5 * Screen.height, 0.25 * Screen.width, 0.25 * Screen.height) 

Cela placera le coin supérieur gauche au centre de l'écran et créera un rectangle de 1/4 de la hauteur et 1/4 de la largeur de l'écran. J'utilise NGUI 2.7 pour l'interface utilisateur et je n'ai vu aucun problème avec les différents formats d'image jusqu'à présent, et celui-ci utilise une caméra orthographique pour restituer l'interface utilisateur.

1
user3234091

Ok, c'est une grande question. Beaucoup de gens ont parlé de forcer un ratio d'aspect, ce qui est une bonne solution à considérer. Cependant, pour de nombreux jeux, cela n'est pas approprié. Pour de nombreuses conceptions de jeu, vous voulez que le jeu ait l’impression qu’il soit natif de l’appareil/de l’écran sur lequel il tourne, et vous voulez utiliser chaque centimètre carré d’écran que vous pouvez utiliser. Pour ce faire, vous devez créer et tester chaque système de votre jeu pour différents écrans de tailles et de formes. C'est un problème très similaire à la création d'applications et de sites Web pour plusieurs appareils.

Taille de l'écran

La taille de l'écran peut être récupérée par programmation à l'aide de DPI et de resolution avec une instruction telle que:

Resolution res = Screen.currentResolution;
float screenSquareInches = res.width * res.height / Screen.dpi;

Pour le contenu à l'écran visualisé par la caméra, il ne reste qu'une variable à redimensionner, à savoir la taille de la caméra (ou la quantité d'éléments contenus dans le monde du jeu qui seront compressés à l'écran). Vous pouvez contrôler la taille de la caméra avec le champ de vision pour les jeux 3D ou la taille orthographique pour les jeux 2D. Seuls les tests permettent de déterminer quelle équation prend en charge la plus large gamme de tailles d’écrans, mais quelque chose dans ce sens pourrait bien servir:

// this should be a tweakable number, so you can fine tune it to your needs. It represents the screen size at which the camera size should not be scaled at all
float expectedScreenArea = 20;
// this number should also be tweakable, which declares how much smaller/larger text can get depending on the screen size. Generally larger screens are viewed from farther away, so scaling should be slight
float cameraScalingRate = 0.25f;
// multiply this number by the default/base camera size you have picked, whether that's field of view or orthographic size
float cameraSizeMultiplier = 1 + (screenSquareInches / expectedScreenArea - 1) * cameraScalingRate;

D'accord, cela devrait vous permettre de mettre le monde du jeu à l'échelle, mais qu'en est-il des éléments de l'interface utilisateur, du texte, du HUD et des commandes à l'écran? Pour des éléments tels que du texte, l'équation ci-dessus devrait fonctionner correctement, bien que vous souhaitiez peut-être une valeur différente pour le taux de mise à l'échelle. Pour les contrôles à l'écran, vous pouvez souhaiter une transformation plus complète, telle que des manettes de jeu se déplaçant vers les coins inférieurs de l'écran sur une tablette plutôt que centrées sur les côtés, ou si ce n'est pas un périphérique à écran tactile, supprimez complètement les contrôles à l'écran. Cela sort du cadre de cette question.

Rapport d'aspect d'écran

Le rapport hauteur/largeur de l’écran (sa largeur par rapport à sa taille) est également important et nécessite sa propre manipulation. Généralement, la meilleure façon de le faire est de figer la hauteur verticale de l’écran, de sorte que lorsque l’écran s’agrandisse, les éléments à l’écran ne sont pas mis à l’échelle, mais à mesure que l’écran grandit, les éléments à l’échelle de l’écran sont proportionnels à leur hauteur. l'écran grandit. C'est déjà le comportement par défaut pour les caméras, mais pour les éléments de l'interface utilisateur, vous devez le définir comme tel. Ceci est relativement facile si vous utilisez le nouveau système d'interface utilisateur avec canvas '. Sur un composant CanvasScalar, il existe une propriété a qui contrôle la mise à l'échelle des éléments en fonction du rapport de format. Modifiez-le pour qu'il corresponde à la largeur ou à la hauteur, et faites-le correspondre à la hauteur.

Pour examen ultérieur

Avec la prise en charge de différentes tailles et formes d’écrans, il ne suffit pas de tout adapter. Vous devez également vous assurer que votre jeu fonctionne bien sur les différents écrans. Cela va des choses aussi subtiles que de ne pas rendre le joueur claustrophobe sur un petit écran et de s'assurer que les ennemis ne peuvent pas tirer sur le joueur s'ils ne sont pas sur l'écran pour s'assurer de mettre à jour les limites qui gardent les éléments à l'écran . Ce qu'il faut considérer, s’il s’agit d’un jeu pour PC, c’est que quelqu'un puisse brancher son ordinateur sur un écran différent ou modifier la résolution à la volée. Dans cet esprit, il peut être bon de réexécuter les équations ci-dessus si nécessaire pour qu'un joueur ne soit pas obligé de quitter le jeu pour que les choses se déroulent correctement.

1
Semimono

Il y a un actif gratuit dans Asset-store concernant ce problème ... Il suffit de vérifier ...

http://u3d.as/content/palash-bhowmick/fit-all-screen-size/9q9

si la forme de votre objet est modifiée, supprimez les lignes commençant par: -

transform.localScale.x =

0
user2830124

si vous n’avez pas le choix, vous pouvez également effectuer quelques travaux supplémentaires et ajouter à votre appareil photo un script spécial qui: 

  1. vérifie la résolution d'écran de l'appareil
  2. définit la résolution cible pour cette
  3. et définit également le rapport de format cible pour celui (IMPORTANT)

il vous suffit d'écrire une fonction de base pour vérifier la résolution de l'écran (largeur et hauteur des périphériques souhaités), puis d'ajouter des fonctionnalités supplémentaires pour définir la résolution d'écran et le format d'image appropriés!

0
a_m_dev

Si vous développez un jeu en 2D, c'est-à-dire que votre appareil photo est en vue orthographique, il vous suffit de créer le code suivant et de le joindre à votre objet de jeu. Il va redimensionner l'objet de jeu (dans ce cas, le Sprite) avec la résolution de l'écran.

void Resize()
{
    SpriteRenderer sr=GetComponent<SpriteRenderer>();
    if(sr==null) return;

    transform.localScale=new Vector3(1,1,1);

    float width=sr.Sprite.bounds.size.x;
    float height=sr.Sprite.bounds.size.y;


    float worldScreenHeight=Camera.main.orthographicSize*2f;
    float worldScreenWidth=worldScreenHeight/Screen.height*Screen.width;

    Vector3 xWidth = transform.localScale;
    xWidth.x=worldScreenWidth / width;
    transform.localScale=xWidth;

    Vector3 yHeight = transform.localScale;
    yHeight.y=worldScreenHeight / height;
    transform.localScale=yHeight;

}
0
Shubhra

C'est très facile pour Unity Now, car Unity3D a son propre système d'interface utilisateur. Pour 3D Unity Ajuste la caméra automatiquement avec la taille de l'écran. Un problème se pose pour l’UI et c’est un peu délicat. Tout d’abord, essayez de déterminer quels éléments doivent changer de position et de taille en fonction de la taille de l’écran ..__ Par exemple, si vous avez un bouton situé exactement au centre de l’écran. Ensuite, il n’est pas nécessaire de changer la position en fonction de l’écran. Il restera au centre. 

Prenons maintenant un scénario dans lequel vous avez un bouton dans le coin de l’écran, comme nous voyons le bouton Pause en haut à droite ou en haut à gauche. Maintenant, vous devrez ancrer votre bouton dans le coin en conséquence. Peu importe la taille de l'écran du jeu, le bouton de pause doit rester dans le coin. 

Prenons maintenant un autre cas dans lequel vous avez un fond dans votre menu. Maintenant, vous devrez appliquer un étirement pour ce BG Sprite. Ce BG va s'étirer et se réduire en conséquence, mais tous les éléments qu'il contient auront une taille fixe. Pour cela, il est recommandé d’avoir les BG à plat pour qu’un même BG puisse avoir une bonne qualité de 16:10 ou 4: 3

0
Mubasher Ikram